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

#h2Wrap {

/*background: rgb(80,101,72); /* Old browsers */
  /*
background: -moz-linear-gradient(top,  rgba(80,101,72,1) 0%, rgba(33,49,28,1) 100%);
background: -webkit-linear-gradient(top,  rgba(80,101,72,1) 0%,rgba(33,49,28,1) 100%);
background: linear-gradient(to bottom,  rgba(80,101,72,1) 0%,rgba(33,49,28,1) 100%);
  */
background: #21445B;
background: radial-gradient(circle, rgba(33, 68, 91, 1) 0%, rgba(5, 28, 48, 1) 100%);
color: #fff;
	height: 90px;
	padding: 10% 0;

}
#h2Wrap h2 {
	color: #ff;
	text-align: center;
  padding: 0 2%;
	font-size: 36px;
}
#h2Wrap h2 .eng {
	margin-right: 0.5em;
	text-shadow: 0px 2px 3px rgba(0,0,0,0.3);
	letter-spacing: 0.1em;
}
#h2Wrap h2 .jpn {
	display: block;
	font-size: 18px;
	font-size: 55%;
}
@media screen and (max-width: 959px) {
	#h2Wrap h2 {
		text-align: center;
		font-size: clamp(18px, 3.0vw, 24px);
	}
	#h2Wrap h2 .eng {
		margin-right: 0;
	}
	#h2Wrap h2 .jpn {
		font-size: 70%;
	}
	.subNav ul li a {
		width: 24%;
	}
}
@media screen and (max-width: 599px) {
	#h2Wrap {
		height: auto;
    background-color: #333;
		padding: 20% 0 5%;

	}
/*	#h2Wrap h2 {
		font-size: 4vw;
		font-size: clamp(14px, 4vw, 16px);
		line-height: 1;
	}*/

	.subNav {
		padding: 15px 0;
	}
	#captionBox {
		padding: 1em 0;
	}
}


#contentWrapNo {
	padding: 5% 0;
} 
.captionBox {
  text-align: center;
  padding: 1em;
}
.caption {
	font-size: 10px;
	line-height: 1.4;
  text-align: justify;
  display: inline-block;
}

/*---------------------------------*/
/*------- plan.idx --------*/
/*---------------------------------*/
#plan.idx {}

#plan.madori .subNav ul li:nth-of-type(2) a {
background-color: #000;
}
#plan.idx .flex {
  align-items: center;
}
#plan.idx #toriWrap {
	max-width: 1000px;
}
#plan.idx #torikageo {
  width: 40%;
 /* max-width: 360px;
  margin: 50px auto;*/
  position: relative
}
#plan.idx #torikageo #swap > div {
  position: absolute;
  width: 100%;
  left: 0;
  top: 0;
  opacity: 0;
  transition: 0.3s;
  mix-blend-mode : multiply;
}
#plan.idx #torikageo #swap > div.shown {
  opacity: 0.5;
}

#plan.idx .madoriBtn {
  width: 40%;
  /*max-width: 700px;*/
  /*margin: 0 auto 50px;*/
	gap:15px 1%;
}

#plan.idx .madoriBtn li {
width: calc((100% / 2) - 2%);

}
#plan.idx .madoriBtn li a {
background-image: url("../img/bg-02.jpg");
	background-repeat: no-repeat;
	background-size: cover;
	background-position: right bottom;
  display: block;
  opacity: 0.7;
	padding: 0 15px 5px;
/*	padding: 3% 10%;*/
	position: relative;
transition: 0.3s;
}
#plan.idx .madoriBtn li a:hover {
	opacity: 1;
}



@media screen and (max-width: 959px) {
  #plan.idx #torikageo {
    width: 70%;
    max-width: 320px;
    margin: 30px auto 30px;
    position: relative
  }

}
@media screen and (max-width: 599px) {
  #plan.idx .madoriBtn li {
    width: calc((100% / 3) - 1%);
    margin-bottom: 1%;
  }
  #plan.idx .madoriBtn {
  	width: 90%;
  /* max-width: 700px; */
  	margin: 0 auto 50px;
		gap: 3px 1%;
  }

}

/*---------------------------------*/
/*------- plan.madori --------*/
/*---------------------------------*/
#plan.madori {}
#plan.madori .madoriWrap {
	/*border-bottom: #ccc solid 1px;*/
}
#plan.madori .madoriBox {
	padding: 50px 0;
}
#plan.madori .madoriBox .txtBox {
	width: 45%;
  padding-top: 50px;
	
	
}
#plan.madori .madoriBox .txtBox dl.flex {

  position: relative;
  overflow: hidden;
  background-image:url("../img/bg-02.jpg");
  background-size:cover;
  background-position: center left;
  background-repeat: no-repeat;
	padding: 3%;
}
#plan.madori .madoriBox .txtBox dl.flex .markBox {
  position: absolute;
  width: 50%;
  height: 100%;
  background-position: left top;
  opacity: 0.1;
  z-index: 0;
  left: -10%;
  top:-35%;
}
#plan.madori .madoriBox .txtBox dl.flex dt {
	width: 40%;
	max-width: 200px;
  position: relative;
  z-index: 1;
    
}

#plan.madori .madoriBox .txtBox dl.flex dd{
	width: 60%;
	max-width: 300px;
  padding: 3%;
}
#plan.madori .madoriBox ul {
	padding: 3em 0 2em;
	
}
#plan.madori .madoriBox li {
	text-align: left;
	font-size: 14px;
	/*list-style: disc;*/
	line-height: 1.4;
	margin-left: 1em;
	padding-bottom: 0.5em;
  color: #21445B;
	text-indent: -1em;
}
#plan.madori .madoriBox li::before {
	content:'◎';
}
#plan.madori .madoriBox .txtBox div.flex {
  background-color: #005491;
  background-image:url("../img/bg-02.jpg");
	background-repeat: no-repeat;
	background-size: cover;
  padding: 30px 50px;
}
#plan.madori .madoriBox .txtBox div.flex .jukohyo {
	width: 50%;
	max-width: 220px;
}
#plan.madori .madoriBox .txtBox div.flex .point {
	width: 46%;
	max-width: 200px;
}
#plan.madori .madoriBox .txtBox .houi {
	width: 100%;
  padding-left: 90%;
  margin-top: -60px;
}
/*#plan.madori .madoriBox .txtBox .houi img {
	width: 40px;
}*/

#plan.madori .madoriBox .zumenBox {
	width: 50%;
	max-width: 600px;
}
#plan.madori {}
#plan.madori ul.ulTab {
	display: none;
}


#plan.madori .madoriBtn {
	padding-top: 20px;
}
#plan.madori .madoriBtn a {
  width: calc((100% / 6) - 0.5%);
	display: block;
}
#plan.madori .madoriBtn a {
  background-image: url("../img/bg-02.jpg");
	background-repeat: no-repeat;
	background-size: cover;
	background-position: right bottom;
  display: block;
  opacity: 0.7;
	padding: 0 15px 5px;
/*	padding: 3% 10%;*/
	position: relative;
	transition: 0.3s;
}
#plan.madori .madoriBtn a:hover,
#plan.madori.typeA .madoriBtn a:nth-child(1),
#plan.madori.typeB .madoriBtn a:nth-child(2),
#plan.madori.typeC .madoriBtn a:nth-child(3),
#plan.madori.typeD .madoriBtn a:nth-child(4),
#plan.madori.typeE .madoriBtn a:nth-child(5),
#plan.madori.typeF .madoriBtn a:nth-child(6)
{
  opacity: 1;
}
  
/*#plan.madori .madoriBtn li:nth-child(2) a,
#plan.madori .madoriBtn li:nth-child(3) a {
	pointer-events: none;
	opacity: 1;
}
#plan.madori .madoriBtn li:nth-child(2) a::after,
#plan.madori .madoriBtn li:nth-child(3) a::after {
	content: "完 売";
	position: absolute;
	left: 0;
	top: 0;
	width: 100%;
	height: 100%;
	display: flex;
justify-content: center;
align-items: center;
	color: #fff;
	font-size: 3.6vw;
	font-size: clamp(18px, 3.6vw, 26px);
	background-color:rgba(153,0,0,0.7);
	z-index: 1;
}*/


@media screen and (max-width: 959px) {
	#plan.madori .madoriBox {
		padding: 50px 3%;
	}
	#plan.madori .madoriBox .txtBox {
		width: 33%;
    padding-top: 0;
	}
	#plan.madori .madoriBox .txtBox dl.flex dt {
		width: 60%;
		
		margin-bottom: 20px;
	}
	#plan.madori .madoriBox .txtBox dl.flex dd{
	width: 100%;
}
	#plan.madori .madoriBox .zumenBox {
		width: 60%;
	}
	ul.ulPc {
		display: none;
	}
	#plan.madori ul.ulTab {
		display: block;
	}
		#plan.madori ul.ulTab li {
		font-size: clamp(14px, 2vw, 16px);
	}
	#plan.madori .madoriBox .txtBox div.flex .jukohyo {
		width: 100%;
		padding: 20px 0;
	}
	#plan.madori .madoriBox .txtBox div.flex .point {
		width: 100%
	}

	#plan.madori .madoriBox .txtBox .houi {
    width: 100%;
    padding-left: 85%;
    margin-top: 20px;
  }
  #plan.madori .madoriBox .txtBox div.flex {
    padding: 15px;
    margin-top: 0px;
  }
  

}
@media screen and (max-width: 599px) {
  #plan.madori .madoriBtn li {
    width: calc((100% / 3) - 1%);
    margin-bottom: 1%;
  }
	#plan.madori .madoriBtn a {
    padding: 5px 0px;
}
  #plan.madori .madoriBox {
    padding: 0 0 20px 0%;
  }
	#plan.madori .madoriBox .txtBox {
		width: 100%;
    padding-top: 30px;
    position: relative;
		 background-image:url("../img/bg-02.jpg");
  background-size:cover;
  background-position: center left;
  background-repeat: no-repeat;
		padding-top: 0;
	}
	#plan.madori .madoriBox .txtBox div.flex,
	#plan.madori .madoriBox .txtBox dl.flex {
		background: none;
	}
  #plan.madori .madoriBox .txtBox dl.flex {
    background-size: 38%;
    background-position: left top;
  }
  #plan.madori .madoriWrap:nth-child(1) .madoriBox .txtBox {
    padding-top: 0px;
		
	}
	#plan.madori .madoriBox .txtBox dl.flex dt {
		width: 40%;
		margin-bottom: 0px;
    padding: 0;
	}
	#plan.madori .madoriBox .txtBox dl.flex dd{
		width: 60%;
	}
	#plan.madori .madoriBox .txtBox div.flex .jukohyo {
		width: 48%;
		padding: 0px 0;
	}
	#plan.madori .madoriBox .txtBox div.flex .point {
		width: 48%;
			padding: 0 0 20px 0;
	}
	#plan.madori .madoriBox .zumenBox {
		width: 100%;
    padding-top: 20px;
	}
	#plan.madori ul.ulTab {
		display: block;
		padding-top: 10px;
		padding-bottom: 0;
	}
  #plan.madori .madoriBox .txtBox div.flex {
    
    padding: 10px;
    padding-top: 0;
    margin-top: 0;
    padding-bottom: 15px;
  }
  #plan.madori .madoriBox .txtBox .houi {
    position: absolute;
    width: 12%;
   right: 2%;
    bottom: 3%;
    padding: 0;
 /*   width: 100%;
    padding-left: 90%;
    margin-top: -20px;*/
  }
  #plan.madori ul.ulTab li {
		font-size: clamp(13px, 3.7vw, 15px);
	}

}
/*========blank BTN=========*/
a.soon {
	opacity: 0.2!important;
	pointer-events: none;
}




