@charset "utf-8";
@media screen and (min-width: 769px){
header#kaitori_header{
	text-align:center;
	z-index:1;
	min-height:80px;
}
header#kaitori_header .container{
	position:relative;
}
header#kaitori_header .container .logo{
	position:absolute;
	top:15px;
	left:0px;
}
header#kaitori_header .container h1{
	position:absolute;
	top:34px;
	left:280px;
	font-size:20px;
	text-align:left;
	font-weight:bold;
	}
header#kaitori_header .container p{
	position:absolute;
	top:18px;
	left:280px;
	font-size:12px;
	text-align:left;
}
header#kaitori_header .container .tel{
	position:absolute;
	top:20px;
	right:160px;
}
header#kaitori_header .container .mail{
	position:absolute;
	top:10px;
	right:0px;
}
header#kaitori_header .container .telSP{
	display:none;}
}
@media screen and (max-width: 768px){
	header#kaitori_header{
	text-align:center;
	z-index:1;
	min-height:80px;
}
header#kaitori_header .container .logo{
	width:70%;
	text-align:center;
	margin:auto;
}
header#kaitori_header .container .tel{
	display:none;
}
header#kaitori_header .container .mail{
	float:left;
	width:45%;
	padding:5px;
	display:inline-block;
}
header#kaitori_header .container .telSP{
	float:right;
	width:45%;
	padding:5px;
	display:inline-block;}
header#kaitori_header .container h1{
	font-weight:bold;
}
header#kaitori_header .container p{
	font-size:10px;
}
}


/*--------------------------------------------*/
/*--------------------title--------------------*/
/*-------------------------------------------*/
@media screen and (min-width: 769px) {
  .kaitori #title {
    background: url(../img/titleBg.jpg) no-repeat center -100px;
    min-height: 1180px;
    text-align: center;
    padding-top: 100px;
    clear: both;
  }
  .kaitori #title .container .title {}
  .kaitori #title .container .title img {
    margin-bottom: 20px;
  }
  .kaitori #title .okomari {
    width: 700px;
    margin: 30px auto;
		display: flex;
		padding-bottom: 80px;
  }
  .kaitori #title .container .okomari h3 {
    margin-right: 30px;
  }
  .kaitori #title .container .okomari ul {
    text-align: left;
    font-size: 20px;
  }
  .kaitori #title .container .okomari ul li {
    font-weight: bold;
    margin-bottom: 10px;
  }
}
@media screen and (max-width: 768px) {
  .kaitori #title {
    background: url(../img/titleBg.jpg) no-repeat center 0px;
    overflow: hidden;
    background-size: 200%;
    text-align: center;
    padding-top: 10%;
    clear: both;
  }
  .kaitori #title .container .title {
    padding: 30px 30px 0 30px;
  }
  .kaitori #title .container .title img {
    margin-bottom: 10px;
  }
  .kaitori #title .okomari {
    margin: 0 auto;
  }
  .kaitori #title .container .okomari h3 img {
    width: 24%;
    float: left;
  }
  .kaitori #title .container .okomari ul {
    display: block;
    margin-left: 25%;
    margin-bottom: 20px;
  }
  .kaitori #title .container .okomari ul li {
    font-weight: bold;
    text-align: left;
    font-size: 92%;
    margin-bottom: 5px;
  }
}
/*--------------------------------------------*/
/*--------------------.kaitori #section1--------------------*/
/*-------------------------------------------*/
@media screen and (max-width: 768px) {
  .kaitori #section1 {
    padding-bottom: 30px;
  }
  .kaitori #section1 .track {
    display: none;
  }
  .kaitori #section1 h2 {
    margin-bottom: 20px;
  }
  .kaitori #section1 p.midashi {
    line-height: 1.7em;
    margin-bottom: 30px;
  }
  .kaitori #section1 ul {
    background: rgba(255, 255, 255, 1.00);
    overflow: hidden;
  }
  .kaitori #section1 ul li {
    float: left;
    width: 48%;
    background: #33CCCC;
    min-height: 380px;
    margin: 1%;
    z-index: 3;
    line-height: 1.7em;
  }
  .kaitori #section1 ul li h3 {
    margin: 10px;
    font-size: 1.2em;
    font-weight: bold;
    text-align: center;
    margin-bottom: 20px;
    margin-top: 20px;
  }
}
@media screen and (min-width: 769px) {
  .kaitori #section1 {
    position: relative;
    padding-bottom: 30px;
  }
  .kaitori #section1 .track {
    position: absolute;
    left: 60%;
    top: -180px;
    z-index: 2;
  }
  .kaitori #section1 h2 {
    margin-bottom: 20px;
  }
  .kaitori #section1 p.midashi {
    width: 600px;
    font-size: 18px;
    line-height: 1.7em;
    margin-bottom: 30px;
  }
  .kaitori #section1 ul {
    display: table;
  }
  .kaitori #section1 ul li {
    display: table-cell;
    background: #33CCCC;
    border: 4px solid rgba(255, 255, 255, 1.00);
    width: 25%;
    z-index: 3;
    line-height: 1.7em;
  }
  .kaitori #section1 ul li h3 {
    font-size: 26px;
    font-weight: bold;
    text-align: center;
    margin-bottom: 20px;
    margin-top: 20px;
  }
}
.kaitori #section1 ul li p {
  margin: 15px;
}
/*--------------------------------------------*/
/*--------------------.kaitori #section2--------------------*/
/*-------------------------------------------*/
@media screen and (min-width: 769px) {
  .kaitori #section2 {
    background: url(../img/section2Bg.png) top center no-repeat #FFEA25;
    padding: 70px 0;
  }
  .kaitori #section2 img {
    margin-bottom: 20px;
  }
}
@media screen and (max-width: 768px) {
  .kaitori #section2 {
    background: url(../img/section2Bg.png) top center no-repeat #FFEA25;
    padding: 30px 0;
  }
  .kaitori #section2 img {
    margin-bottom: 0px;
  }
}
.kaitori #section2 .box {
  border: #FFCC00 solid 10px;
  padding: 20px;
  background: rgba(255, 255, 255, 1.00);
  text-align: center;
}
/*--------------------------------------------*/
/*--------------------.kaitori #section3--------------------*/
/*-------------------------------------------*/
.kaitori #section3 {
  background: #FFCC00;
  padding: 40px 0;
  overflow: hidden;
}
@media screen and (max-width: 768px) {
  .kaitori #section3 {
    background: #FFCC00;
    overflow: hidden;
    padding: 0;
  }
}
@media screen and (min-width: 769px) {
  .kaitori #section3 .left {
    float: left;
    width: 600px;
  }
  .kaitori #section3 .right {
    float: right;
    width: 400px;
  }
  .kaitori #section3 {
    background: #FFCC00;
    padding: 40px 0;
    overflow: hidden;
  }
}
/*--------------------------------------------*/
/*--------------------.kaitori #section4--------------------*/
/*-------------------------------------------*/
@media screen and (min-width: 769px) {
  .kaitori #section4 {
    background: url(../img/section4bg.jpg) no-repeat top;
    background-size: auto 100%;
    min-height: 700px;
    padding: 30px 0;
		text-align: center;
  }
  .kaitori #section4 h2 {
    margin-bottom: 50px;
  }
  .kaitori #section4 ul {
		display: flex;
		flex-wrap: wrap;
		gap: 80px 40px;
		margin-bottom: 30px;
  }
  .kaitori #section4 ul li {
    flex-basis: calc(50% - 40px);
    background: rgba(255, 255, 255, 0.7);
    padding: 15px;
		display: flex;
		flex-direction: column;
		align-items: center;
  }
  .kaitori #section4 ul li img {
    margin-top: -50px;
  }
  .kaitori #section4 ul li h3 {
    margin-bottom: 1em;
    font-size: 30px;
    font-weight: bold;
    color: #00008C;
  }
}
@media screen and (max-width: 768px) {
  .kaitori #section4 {
    background: url(../img/section4bg.jpg) no-repeat top;
    background-size: cover;
    overflow: hidden;
    padding: 30px 0;
		text-align: center;
  }
  .kaitori #section4 h2 {
    margin-bottom: 40px;
  }
  .kaitori #section4 ul {
    display: flex;
    flex-wrap: wrap;
		gap: 80px 15px;
  }
  .kaitori #section4 ul li {
    flex-basis: calc(50% - 7.5px);
    background: rgba(255, 255, 255, 0.7);
    text-align: center;
    padding: 0px;
    min-height: 330px
  }
  .kaitori #section4 ul li img {
    margin-top: -50px;
    width: 50%;
  }
  .kaitori #section4 ul li h3 {
    margin: 10px;
    font-weight: bold;
    color: #00008C;
  }
  .kaitori #section4 ul li p {
    margin: 10px;
    text-align: left;
  }
}
.kaitori #section4 ul li p {
  text-align: left;
}
.kaitori #section4 .iso img {
  width: 150px;
}
@media screen and (max-width: 768px) {
  .kaitori #section4 .iso img {
    width: 60%;
  }
}