@charset "UTF-8";
/* CSS Document */
section{
	margin-bottom:0;
}

@media only screen and (max-width: 768px){
.sec_Inner{
	padding:3%;
	box-sizing:border-box;
}
}

/* ------------------------------
   貸コース・教習メニュー
------------------------------ */
#menu{
	padding:3% 0;
}
@media only screen and (max-width: 768px){
#menu{
	width:100%;
	padding:0;
	box-sizing:border-box;
	-webkit-box-sizing:border-box;
	margin-bottom:3%;
}
}

#menuList {
    height: auto;
    margin-bottom: 0;
    overflow: hidden;
    width: 100%;
}

#menuList .menuBox {
	box-sizing:border-box;
    display: block;
	height:121px;
    float: left;
	position: relative;
    text-decoration: none;
	margin-bottom: 0.8%;
    margin-right: 1.3%;
    width: 24%;
	border:5px solid #d9e4f2;
	background-position: left bottom;
    background-repeat: no-repeat;
	background-size:contain;
}
@media only screen and (max-width: 768px){
#menuList .menuBox {
    height: 90px;
	position:static;
	margin-bottom: 1%;
    margin-right: 1%;
    width: 49.5%;
	border:none;
	box-sizing: border-box;
}
}

#menuList .menuBox:nth-child(4),
#menuList .menuBox:last-child{
	margin-right:0;
}
@media only screen and (max-width: 768px){
#menuList .menuBox:nth-child(4),
#menuList .menuBox:last-child{
	margin-right:1%;
}

#menuList .menuBox:nth-child(odd){
	margin-right:0;
}
}

#menuList .menuTxt p{
	display: table-cell;
    vertical-align: middle;
}

#menuList .menuTxt img{
	width:86px;
}

/*貸コース*/
#menuList .box01{
	height:250px;
	background-position: right bottom;
	background-size:cover;
}
@media only screen and (max-width: 768px){
#menuList .box01{
	height:90px;
	width:100%;
}
}

#menuList .box01 .menuTxt{
	background-color:#ec9215;
	position: relative;
	padding:2rem 1rem;
}
@media only screen and (max-width: 768px){
#menuList .box01 .menuTxt{
	position:static;
	padding:0;
	height:100%;
	width:100%;
	display:table;
}
}

#menuList .box01 .menuTxt::after {
  border-top: 12px solid #ec9215;
  border-right: 12px solid transparent;
  border-left: 12px solid transparent;
  content: '';
  margin-left: -10px;
  position: absolute;
  bottom: -12px;
  left: 50%;
}
@media only screen and (max-width: 768px){
#menuList .box01 .menuTxt::after {
  border: none;
  margin-left: 0;
  position:static;
}
}

#menuList .box01 .menuTxt p{
	display:block;
}
@media only screen and (max-width: 768px){
#menuList .box01 .menuTxt p{
	display:table-cell;
}
}

#menuList .box01 .menuTxt img{
	width:98px;
}


/*各コース（貸コース以外）共通*/
#menuList .box02 .menuTxt,
#menuList .box03 .menuTxt,
#menuList .box04 .menuTxt,
#menuList .box05 .menuTxt,
#menuList .box06 .menuTxt,
#menuList .box07 .menuTxt{
	width:50%;
	display:table;
	height:100%;
	float:right;
	position: relative;
}
@media only screen and (max-width: 768px){
#menuList .box02 .menuTxt,
#menuList .box03 .menuTxt,
#menuList .box04 .menuTxt,
#menuList .box05 .menuTxt,
#menuList .box06 .menuTxt,
#menuList .box07 .menuTxt{
	width:100%;
	float:none;
	position:static;
}
}

#menuList .box02 .menuTxt::after,
#menuList .box03 .menuTxt::after,
#menuList .box04 .menuTxt::after,
#menuList .box05 .menuTxt::after,
#menuList .box06 .menuTxt::after,
#menuList .box07 .menuTxt::after{
	border-top: 12px solid transparent;
	border-bottom: 12px solid transparent;
	content: '';
	margin-top: -10px;
	position: absolute;
	left: -12px;
	top: 50%;
}

/*普通一種コース*/
#menuList .box02 .menuTxt{
	background-color:#bbd436;
}

#menuList .box02 .menuTxt::after{
	border-right: 12px solid #bbd436;
}

/*準中型コース*/
#menuList .box03 .menuTxt{
	background-color:#57c4d0;
}

#menuList .box03 .menuTxt::after{
	border-right: 12px solid #57c4d0;
}

/*普通二種コース*/
#menuList .box04 .menuTxt{
	background-color:#ec8686;
}

#menuList .box04 .menuTxt::after{
	border-right: 12px solid #ec8686;
}

/*失効・取消コース*/
#menuList .box05 .menuTxt{
	background-color:#73adcb;
}

#menuList .box05 .menuTxt::after{
	border-right: 12px solid #73adcb;
}

/*外国免許切替コース*/
#menuList .box06 .menuTxt{
	background-color:#b083ce;
}

#menuList .box06 .menuTxt::after{
	border-right: 12px solid #b083ce;
}

/*ペーパードライバー教習*/
#menuList .box07 .menuTxt{
	background-color:#f8c325;
}

#menuList .box07 .menuTxt::after{
	border-right: 12px solid #f8c325;
}

/* ------------------------------
   多摩コースについて
------------------------------ */
#about{
	width:100%;
	background:url(/images/bg_about.jpg) no-repeat;
	padding:3% 0;
	background-size:cover;
}

#about h3{
	color:#fff;
}

#about h3::after {
content: "";
position: absolute;
left: 0;
bottom: -10%;
width: 100%;
height: 7px;
background: url("/common/images/bg_h3_white.gif") repeat-x;
}

#about p{
	color:#fff;
	text-align:center;
	line-height:2.1rem;
}
@media only screen and (max-width: 768px){
#about p{
	text-align:left;
	line-height:1.5rem;
	font-size:0.9rem;
}
}

/* ------------------------------
   お知らせ
------------------------------ */
#info{
	padding:3% 0;
}

#info ul li{
	border-bottom: dashed 1px #cccccc;
	padding:0.8rem 0;
}
@media only screen and (max-width: 768px){
#info ul li{
	padding:0.2rem 0;
}
}

#info ul li:first-child{
	padding:0 0 0.8rem 0;
}
@media only screen and (max-width: 768px){
#info ul li:first-child{
	padding:0 0 0.2rem 0;
}
}

#info ul li dl{
	width: 100%;
	overflow: hidden;
}

#info ul li dt{
	clear: left;
	float: left;
	color:#0070c2;
	margin-right:3%;
}
@media only screen and (max-width: 768px){
#info ul li dt{
	margin-right:0;
}
}

#info ul li dd{
	display: block;
	float: left;
}
#info ul li dt,
#info ul li dd{
	display: block;
	vertical-align:top;
	margin-bottom: 2%;
}

/*#info ul li dt,
#info ul li dd{
	display:inline-block;
	vertical-align:top;
}*/
@media only screen and (max-width: 768px){
#info ul li dt,
#info ul li dd{
	display:block;
}
}