@charset "utf-8";

.section,
#ftrContact{
	margin-top: 0;
}
/*--------------------
main
---------------------*/

.mainvisual{
	/*background: linear-gradient(#504d60 60%, #fff 30%);*/
	position: relative;
}
.mainvisual:before{
	content: '';
	width: 0;
	height: 79%;
	background: #504d60;
	position: absolute;
	left: 0;
	top: 0;
	z-index: -1;

	-webkit-animation: mainAnimation 1.2s ease 0.2s 1 forwards;/*表示時間+start時間*/
	animation: mainAnimation 1.2s ease 0.2s 1 forwards;/*表示時間+start時間*/
}
@-webkit-keyframes mainAnimation {
  100% {
	width: 100%;
  }
}
@keyframes mainAnimation {
  100% {
    width: 100%;
  }
}
@media only screen and (max-width:736px) {
	.mainvisual{
		/*background: linear-gradient(#504d60 30%, #fff 30%);*/
		padding-top: 20px;
	}
	.mainvisual:before{
		height: 49%;
	}
}

/*slider*/
.slider{
}
.slider li{
	position: relative;
}
.slider li img{
	width:100%;
}
.slider li .cap{
	position: absolute;
	right: 10px;
	bottom: 5px;
}

/*usp*/
.usp{
	display: -webkit-flex; /* Safari */
	display: flex;
	-webkit-justify-content: center; /* Safari */
	justify-content: center;
}
.usp li{
	font-size: 20px;
	line-height: 1.3;
}
.usp li small{
	font-size: 12px;
}
.usp li strong{
	font-size: 24px;
	font-weight:300;
}
.usp li .Amiri{
	font-size: 42px;
	color:#af9377;
	padding:0 2px;
}
.usp li:nth-child(n+2):before{
	content: '/';
	font-size: 16px;
	color:#999999;
	margin:0 5px;
}
/*main-txt*/
.main-txt{
	font-size: 18px;
	line-height: 1;
	display: -webkit-flex; /* Safari */
	display: flex;
	-webkit-justify-content: center; /* Safari */
	justify-content: center;
}
.main-txt li:nth-child(n+2):before{
	content: '・';
}
.main-txt .Amiri{
	font-size: 22px;
}
.main-txt sup{
	font-size: 10px;
}
@media only screen and (max-width:1020px) {
	.main-txt{
		text-align: center;
		margin-top: 10px;
		display: block;
	}
	.main-txt li{
		line-height: 1;
	}
	.main-txt li:nth-child(n+2){
		margin-top: 10px;
	}
	.main-txt li:nth-child(n+2):before{
		content: none;
	}

}
@media only screen and (max-width:736px) {
	.usp{
		display: block;
		text-align: center;
	}
	.usp li{
		display: inline-block;
		font-size: 16px;
		position: relative;
		text-align: left;
	}
	.usp li small{
		font-size: 10px;
		position: absolute;
		left: 12px;
		top: -4px;
	}
	.usp li strong{
		font-size: 22px;
	}
	.usp li .Amiri{
		font-size: 36px;
	}
	.usp li:nth-child(n+2){
		margin-top: 5px;
	}
	.usp li:nth-child(n+2):before{
		content: none;
	}
	.main-txt{
		font-size: 15px;
		line-height: 1.5;
	}
}

/*--------------------
information
---------------------*/
.information{
	margin:30px 0 75px;
	text-align: center;
}
.information .wrap{
	padding-top: 35px;
	border-top:solid 1px #cbcbcb;		
}
.information .bnr{
	margin: 40px auto;
}
.info-01 {
	margin: 0 auto 10px;
	max-width: 600px;
	border-bottom: 1px solid #ccc;
	padding-bottom: 10px;
	letter-spacing: 0.16em;
}
.info-01_txt {
	font-size: 24px;	
}
.info-01_txt .date {
	font-size: 30px;
}
.info-01_txt .week {
	font-size: 18px;
}
.info-01_lead {
	font-size: 30px;
}
.info-02 {
	margin: 0 auto 15px;
	max-width: 600px;
	border-bottom: 1px solid #ccc;
	padding-bottom: 5px;
	color: #c28f5c;
	font-size: 22px;
}
.info-02 .size {
	font-size: 30px;
}
.info-02 .num {
	margin-left: 10px;
	font-size: 35px;	
}
.info-02 .schedule {
	font-size: 18px;
}
.info-02 .cap{
	text-align:right;
	line-height:1.0;
	margin: 0 5px 0 0;
	padding-top: 0;
}

@media only screen and (max-width:736px) {
	.info-01 {
		margin-bottom: 10px;
		letter-spacing: 0.16em;
	}
	.info-01_txt {
		font-size: 20px;	
	}
	.info-01_txt .date {
		font-size: 26px;
	}
	.info-01_txt .week {
		font-size: 14px;
	}
	.info-01_lead {
		font-size: 20px;
	}
	.info-02 {
		font-size: 18px;	
	}
	.info-02 .size {
		font-size: 22px;
	}
	.info-02 .num {
		margin-left: 10px;
		font-size: 26px;	
	}
	.info-02 .schedule {
		font-size: 14px;
	}
}

/*info-ttl*/
.info-ttl{
	font-size: 16px;
	margin-bottom: 20px;
}
.info-txt{
	font-size: 30px;
	line-height: 1.6em;
}
.info-txt strong.Amiri{
	font-size: 30px;
}
.info-txt small{
	font-size: 22px;
}
.info-txt small.Amiri{
	font-size: 20px;
}
.info-txt strong{
	font-size: 30px;
	font-weight:normal;
	letter-spacing: 0.2em;
}
.info-red{
	font-size: 12px;
	color:#8e0000;
	margin-top: 5px;
}
@media only screen and (max-width:736px) {
	.information{
		margin:40px 0 60px;
	}
	.information .wrap{
		width: 90%;
		padding: 30px 0 0;
	}
	/*info-ttl*/
	.info-ttl{
		font-size: 18px;
	}
	.info-txt{
		font-size: 17px;
	}
	.info-txt strong.Amiri{
		font-size: 20px;
	}
	.info-txt small{
		font-size: 13px;
	}
	.info-txt small.Amiri{
		font-size: 14px;
		line-height: 2.5;
	}
	.info-txt strong{
		font-size: 16px;
	}
	.info-red{
		font-size: 10px;
	}
}

/*--------------------
cntBox
---------------------*/
.cntBox{
	position: relative;
}
.cntBox-num{
	width: 28.000000000000004%;
	position: absolute;
}
.cntBox-img{
	width: 62.5%;
	position: relative;
}
.cntBox-txt{
	width: 41.66666666666667%;
	box-sizing: border-box;
	position: absolute;
	/*background:
		linear-gradient(135deg, transparent 10px, #fff 0) top left,
		linear-gradient(225deg, transparent 10px, #fff 0) top right,
		linear-gradient(315deg, transparent 10px, #fff 0) bottom right,
		linear-gradient(45deg,  transparent 10px, #fff 0) bottom left;
	background-image:
		radial-gradient(circle at 0 0, rgba(255,255,255,0) 12px, #fff 13px),
		radial-gradient(circle at 100% 0, rgba(255,255,255,0) 12px, #fff 13px),
		radial-gradient(circle at 100% 100%, rgba(255,255,255,0) 12px, #fff 13px),
		radial-gradient(circle at 0 100%, rgba(255,255,255,0) 12px, #fff 13px);
	background-size: 50% 50%;
	background-repeat: no-repeat;*/
	/*box-shadow: 1px 1px 2px rgba(0,0,0,0.1); */
	padding:20px 30px;
	box-sizing:border-box;
	z-index: 5;
}
.cntBox-txt:before{
	content: '';
	width:20px;
	height: 20px;
	background: url(../imgs/bg-txt01.png) no-repeat left top;
	background-size:100%;
	position: absolute;
	left: 0;
	top: 0;
}
.cntBox-txt:after{
	content: '';
	width:20px;
	height: 20px;
	background: url(../imgs/bg-txt02.png) no-repeat right top;
	background-size:100%;
	position: absolute;
	right: 0;
	top: 0;
}
.inner01{
	width:100%;
	/*height: 86%;*/
	background:#fff;
	box-sizing:border-box;
	position: absolute;
	left: 0;
	top: 20px;
	z-index: -1;
}
.inner02{
	/*width:92%;*/
	height: 100%;
	position: absolute;
	left: 20px;
	top: 0;
	background:#fff;
	padding:0 20px;
	box-sizing:border-box;
	z-index: -1;
}
.cntBox-txt02{
	height: 100%;
	padding:20px 0;
	box-sizing: border-box;
}
.cntBox-txt02:before{
	content: '';
	width:20px;
	height: 20px;
	background: url(../imgs/bg-txt03.png) no-repeat left bottom;
	background-size:100%;
	position: absolute;
	left: 0;
	bottom: 0;
}
.cntBox-txt02:after{
	content: '';
	width:20px;
	height: 20px;
	background: url(../imgs/bg-txt04.png) no-repeat right bottom;
	background-size:100%;
	position: absolute;
	right: 0;
	bottom: 0;
}
.cntBox-txt .cntBoxtype{
	font-size: 14px;
	color:#af9377;
	letter-spacing: 0.2em;
	font-family: 'Amiri', 'Noto Serif Japanese';
}
.cntBox-txt .cntBoxTtl{
	font-size: 22px;
	margin-top: 15px;
}
.cntBox-txt .cntBoxTxt{
	font-size: 13px;
	margin-top: 10px;
	letter-spacing: 0.2em;
	line-height: 2;
}
.cntBox-txt .btn-more{
	float: right;
	margin-top: 30px;
}
.cntBox .cap{
	position: absolute;
}

@media only screen and (max-width:1024px) {
	.cntBox-txt{
		width: 55.66666666666667%;
	}
}

@media only screen and (max-width:736px) {
	.cntBox{
	}
	.cntBox-num{
		width: 50%;
		right: 0 !important;
		top: -10% !important;
		left:auto !important;
		z-index: 1;
	}
	.cntBox-img{
		position: relative;
		width: 100%;
		z-index: 2;
	}
	.cntBox-txt{
		width: 90%;
		padding:20px;
		left: 0 !important;
		right: 0 !important;
		top: 80% !important;
		margin:auto;
		z-index: 3;
	}
	.cntBox-txt02{
		padding:10px 0;
	}
	.cntBox-txt .cntBoxtype{
		font-size: 13px;
	}
	.cntBox-txt .cntBoxTtl{
		font-size: 16px;
	}
	.cntBox-txt .cntBoxTxt{
		font-size: 10px;
	}	
	.cntBox-txt .btn-more{
		margin-top: 15px;
	}
	.cntBox .cap{
		right:20px !important;
		left:auto !important;
	}
}


/*toplocation*/
.toplocation{
	padding: 80px 0 140px;
	position: relative;
}
.toplocation:before{
	content: '';
	width: 0;
	height: 100%;
	background: #f6f4ee;
	position: absolute;
	right: 0;
	top: 0;
	transition: 1s;
}
.toplocation.open:before{
	width: 100%;
}
.toplocation .cntBox-num{
	right: 0;
	top: 20.51282051282051%;
}
.toplocation .cntBox-txt{
	right: 8.333333333333332%;
	top: 48.717948717948715%;
}
.toplocation .cap{
	left: 7px;
	bottom: 5px;
}

/*topaccess*/
.topaccess{
	padding: 80px 0 140px;
	position: relative;
}
.topaccess:before{
	content: '';
	width: 0;
	height: 100%;
	background: #504d60;
	position: absolute;
	left: 0;
	top: 0;
	transition: 1s;
}
.topaccess.open:before{
	width: 100%;
}
.topaccess .cntBox-img{
	margin-left: 37.5%;
}
.topaccess .cntBox-num{
	left: 0;
	top: 20.51282051282051%;
}
.topaccess .cntBox-txt{
	left: 8.333333333333332%;
	top: 48.717948717948715%;
}
.topaccess .cap{
	right: 7px;
	bottom: 5px;
}

/*topplan*/
.topplan{
	padding: 80px 0 140px;
	position: relative;
}
.topplan:before{
	content: '';
	width: 0;
	height: 100%;
	background: #fafafa;
	position: absolute;
	right: 0;
	top: 0;
	transition: 1s;
}
.topplan.open:before{
	width: 100%;
}
.topplan .cntBox-num{
	right: 0;
	top: 4.615384615384616%;
}
.topplan .cntBox-txt{
	right: 8.333333333333332%;
	top: 35.04273504273504%;
}
.topplan .cap{
	left: 7px;
	bottom: 15.042735042735043%;
}
@media only screen and (max-width:1024px) {
	.toplocation,
	.topaccess{
		padding: 75px 0 180px;
	}
}
@media only screen and (max-width:736px) {
	.toplocation,
	.topaccess,
	.topplan{
		padding:75px 0 250px;
	}
	.topaccess .cntBox-img{
		margin-left: 0;
	}
	.toplocation .cap.color-white{
		color: #cccccc;
	}
	.topplan .cap.color-black{
		color: #cccccc;
	}
}
@media only screen and (max-width:360px) {
	.topplan{
		padding:75px 0 300px;
	}

}