@charset "utf-8";

/*=====================================================

	料金について

=======================================================*/

.mainV .mainPhoto { position: absolute; top: 7em; width: 100%;  height: 22vw; background: url("../img/mainPhoto.png")no-repeat; background-size: auto 100%; }

@media screen and (max-width:768px){
.mainV .mainPhoto { top: 5em; height: 28vw; }
}
@media screen and (max-width:499px){
.mainV .mainPhoto { top: 4em; height: 30vw; background-position: center;}
}


/* --------------------------------------------
	料金設定 https://www.unionnet.jp/blog/responsive-table-css/
---------------------------------------------- */ 
.point { padding: 1.5em; text-align: center; border: solid 2px #00a9db; border-radius: 50px; margin-bottom: 3em; color: #00a9db; font-size: 16px; font-size: 1.6rem;}

#contentinner section { margin-bottom: 5em;}
.feeBox h4 { font-size: 18px; font-size: 1.8rem; font-weight: 600; position: relative; padding-left: 30px; margin: 0 0 .5em;}
.feeBox h4::before { position: absolute; left: 0; top: .2em; display: block; content: ""; background: url("../img/blueflag.png")no-repeat; background-size: cover; width: 20px; height: 22px; }
.feeBox h4 span { color: #E62736; font-weight: 600; font-size: 14px; font-size: 1.4rem; vertical-align: middle; }
.feeBox h4 br { display: none;}

@media only screen and (max-width: 599px) { 
#contentinner section { margin-bottom: 4em;}
.feeBox h4 span { margin-left: -30px; }
.feeBox h4 br { display: block;}
}

/*----- table -----*/
section table { width: 100%; }
section th, section td  { padding: 10px; border: 1px solid #2B3438; }
section th  { background: #A8E3E6; font-weight: normal; }
section th span { color: #E62736; }
section .tableBoeder { overflow: auto; white-space: nowrap;  }
section .tableBoederPink {  }
section .tableBoeder::before {  }
section .tableBoederPink::before {  }

.demo02 { }
.demo02 th  { width: 13%; text-align: center;}
.demo02 td  { text-align: center; vertical-align: middle;}
.demo02 td:first-child  { background: #F0F6F7; line-height: 1.3;}
.demo02 thead { }
.demo02 tbody { }
.demo02 tbody tr { }
.demo02 tbody td br { }
.demo02Pink { margin: 2em 0 .6em; }
.demo02Pink th { background: #F9D3E3;}

@media only screen and (max-width: 930px) { 
section .tableBoeder::before { content: "※ 横にスクロールしてご閲覧ください。";}
section .tableBoederPink::before { content: ""; }
}


/*@media only screen and (max-width: 80px) { 
  .demo02 { 
    display: block; 
    width: 100%; 
    margin: 0 auto;
  }
  .demo02 thead{ 
    display: block; 
    float: left;
    overflow-x:scroll;
  }
  .demo02 tbody{ 
    display: block; 
    width: auto; 
    overflow-x: auto; 
    white-space: nowrap;
  }
  .demo02 th{ 
    display: block;
    width:auto;
		line-height: 1.5;
  }
  .demo02 tbody tr{ 
    display: inline-block; 
    margin: 0 -4px;
  }
  .demo02 td{ 
    display: block;
		line-height: 1.5;
  }
	.demo02 td:first-child  { line-height: 1.5;}
	.demo02 tbody td br { display: none;}
}*/