@charset "utf-8";
/* CSS Document */

.contact, .campcon{
	font-family: source-han-sans-japanese, sans-serif; 
	font-weight: 300; 
	font-style: normal;
	color: #0C5AB2;
}

.conbutton{
	background: #F6F191;
	display: inline-block;
	padding: 20px 60px;
	border-radius: 20px;
	font-weight: 700;
	position: relative;
	font-size: 18px;
	color: #E64545;
	max-width: 300px;
}

.conbutton::after{
	content: "\f054";
	font-family: "Font Awesome 5 Free";
	position: absolute;
	font-weight: bold;
	right: 5%;
	bottom: 50%;
	transform: translateY(50%);
}

.camptopwrap{
	width: 75%;
	max-width: 1200px;
	margin: 60px auto 0;
	position: relative;
  background: linear-gradient(45deg, #DDC76B 25%, transparent 25%, transparent 75%, #DDC76B 75%),
              linear-gradient(45deg, #DDC76B 25%, transparent 25%, transparent 75%, #DDC76B 75%);
  background-color: #D3BC48;
  background-size: 60px 60px;
  background-position: 0 0, 30px 30px;	
}

h1{
	font-family: source-han-sans-japanese, sans-serif;
	padding: 10px 0;

}

.camp-title{
	text-align: center;
	font-family: source-han-sans-japanese, sans-serif;
	color: #E64545;
	display: flex;
	align-items: center;
	justify-content: center;
	background-color: #FFFCBD;
	order:2;
	min-width: 45%;
}

.title-middle{
	padding: 0 15px;
}

.title-p{
	line-height: 1.5;
}

.title-p2{
	margin-top: 10px;
	line-height: 1.3;
}

.h1wrap{
	height: 70vh;
	position: relative;
	max-height: 500px;
	display:flex;
	justify-content: center;
}

h1 img{
	z-index: 2;
	margin: auto;
	flex-basis:100%;
	width: 100%;
	max-width: 500px;
	display: block;
}

.nengajo{
	max-height: 100%;
	order:1;
}

.campname{
	line-height: 1.1;
	font-size: 44px;
	font-family: heisei-mincho-std, serif;
	margin-top: 10px;
	display: inline-block;
}

.sub-h1{
	font-size: 20px;
}


h1 .red{
	font-size: 30px;
}

.top1{
	border-right: none;
}

.top2{
	border-left: none;
}

.contact{
	text-align: center;
	padding: 25px 0;
	
}

.contact p{
	font-weight: 500;
	margin-bottom: 10px;
	font-feature-settings: "palt";
}

.number{
	color: #E64545;
	font-size: 30px;
	font-weight: 700;
}

.campcon{
/*	background: #e3ebfc;
*/	text-align: center;
	padding-top: 35px;
/*background-color: #c5d7ff;
*/background-image: url("data:image/svg+xml,%3Csvg width='20' height='20' viewBox='0 0 20 20' xmlns='http://www.w3.org/2000/svg'%3E%3Cg fill='%23e3ebfc' fill-opacity='1' fill-rule='evenodd'%3E%3Ccircle cx='3' cy='3' r='3'/%3E%3Ccircle cx='13' cy='13' r='3'/%3E%3C/g%3E%3C/svg%3E");
	padding-bottom: 40px;
	width: 75%;
	max-width: 1200px;
	margin: 0 auto;
}

.campcon>h2{
	font-size: 25px;
	line-height: 1.3;
	font-feature-settings: "palt";
}

.red{
	color: #E64545;
}

.campcon>p{
	margin: 20px 0 40px;
	line-height: 1.8;
	font-size: 15px;
}

.campcon p{
	color: black;
}

.bold{
	font-weight: bold;
}

.campaigncontent{
	width: 95%;
	max-width: 900px;
	margin: 0 auto;
	border: 10px solid #0C5AB2;
	background: #fff;
	border-radius: 50px;
}

.campaignprice{
	width: 95%;
	margin: 0 auto;
	padding-bottom: 40px;
	border-bottom: 2px solid #0C5AB2;
}

.campaignprice p{
	margin-top: 30px;
	font-weight: 700;
}

.campaignprice p:first-of-type{
	font-size: 14px;
}


.campaignprice p:last-of-type{
	margin-top: 10px;
}

.campaignprice h2 img{
	display: block;
	max-width: 500px;
	margin: 0 auto;
	width: 100%;
}

.campaignprice>img:first-of-type{
	display: block;
	max-width: 600px;
	margin: 20px auto 0;
	width: 90%;
}

.campcon .zeroyen{
	font-size: 30px;
	color: #0C5AB2;
	margin-top: 10px;
	display: inline-block;
	position: relative;

}

.zerowrap{
	position: relative;
}

.zerowrap::before{
	position: absolute;
	width: 100%;
	height: 50%;
	background: #F6F191;
	bottom: 0;
	left: 0;
}

.zero{
	font-size: 100px;
	
}

.campaignprice .pr-att{
	line-height: 1.3;
	letter-spacing: 0.05em;
	margin-top: 5px;
}

.linklist{
	display: flex;
	justify-content: center;
	margin-bottom: 20px;
}

.link-item1{
	margin-right: 10px;align-items: center;
	display: flex;
}

.link-item1 a{
	height: 100%;
	display: flex;
	align-items: center;
	vertical-align: middle;
	line-height: 1.2;
}

.campaignprice .present{
	width: 90%;
	max-width: 700px;
	margin: 10px auto 5px;
	line-height: 1.5;
	font-size: 20px;
	letter-spacing: 0.05em;
	border: 1px solid #0C5AB2;
	padding: 15px;
	border-radius: 10px;
}


.campaignprice img:nth-of-type(2){
	display: block;
	max-width: 500px;
	margin: 0 auto 20px;
	width: 80%;
}

.campaignmeritrecommend{
	overflow: hidden;
	margin-bottom: 15px;
}

.campaignmeritrecommend h2 img{
	display: block;
	max-width: 450px;
	margin: 30px auto 20px;
	width: 100%;
}

.campaignmeritrecommend ul{
	text-align: left;
	color: black;
	line-height: 1.5;
	font-size: 14px;
	margin-top: 25px;
	display: inline-block;
}

.campaignmeritrecommend ul li{
	text-indent: calc(-1em + 2px);
	padding-left: calc(1em + 2px);
	vertical-align: middle;
	margin-bottom: 5px;
}

.campaignmeritrecommend ul li span{
	text-indent: calc(-1em + 2px);
	padding-left: calc(1em + 2px);
	vertical-align: middle;
}

.campaignmeritrecommend ul li::before{
	content: "\f3a5";
	font-family: "Font Awesome 5 Free";
	color: #0C5AB2;
	padding-right: 2px;
	font-size: 17px;
	vertical-align: middle;
}

.campaignmerit, .campaignrecommend{
	width: 50%;
	float:left;
	padding-top: 30px;
	margin-top: 10px;
	padding: 10px 15px 15px;
}

.campaignmerit{
	border-right: 2px dashed #0C5AB2;
}

.campaignmerit>p, .campaignrecommend>p{
	font-weight: 700;
	padding-bottom: 5px;
}

.campaignrecommend{
	padding: 10px 11px;
}

.campaigncontent>a{
	margin-bottom: 30px;
}

.campcontent p{
	line-height: 1.5;
	text-align: left;
	display: inline-block;
}

.camex{
	width: 95%;
}

/*2つめのキャンペーン装飾
*/

.h1wrap2{

	position: relative;

	background-image: linear-gradient(
	-45deg,
	#FFEE55 25%,
	#fff 25%,
	#fff 50%,
	#FFEE55 50%,
	#FFEE55 75%,
	#fff 75%,
	#fff
);
background-size: 40px 40px;
	display: flex;
	justify-content: center;
	align-items: center;
	text-align: center;
	font-family: source-han-sans-japanese, sans-serif;
}

.camp-title2{
	background: #fff;
	width: 90%;
	padding: 20px;
	color: #000;
	margin: 20px 0;
}

.sub-p{
	font-size: 17px;
	margin-bottom: 5px;
}

.camp-h1-2{
	line-height: 1.3;
	border-top: 2px solid #000;
	border-bottom: 2px solid #000;
	padding: 5px 0 13px;
}

.keikou-under{
	background:linear-gradient(transparent 70%, #FF85D6 30%);
}

.sub-h1-2{
	font-size: 22px;
}

.campname2{
	font-size: 30px;
}

.camp-catch{
	margin: 10px 0 20px;
	font-size: 20px;
	line-height: 1.2;
	font-feature-settings: "palt";
}

.camp-price{
	font-size: 32px;
	padding: 0 2px;
}

.camp-price2{
	font-size: 40px;
	padding: 0 2px;
}

.pack-content{
	margin: 10px 0;
	text-align: center;
	width: 85%;
	display: inline-block;
	font-size: 26px;
	font-weight: bold;
}

.pack-item{
	background: #FFFCD9;
	border-radius: 50px;
	border: 1.5px solid #000;
	padding: 12px;
}

.pack-sub{
	font-size: 18px;
}

.plus{
	font-size: 28px;
}

.senchaku{
	font-size: 18px;
	letter-spacing: 0.05em;
	margin-bottom: 15px;
	line-height: 1.2;
}

.kikan{
	padding: 15px 20px;
	border: 1px solid #000;
	border-radius: 50px;
	display: inline-block;
	line-height: 1.2;
}
.r-br{
	display: none;
}

.camp-p{
	padding: 0 10px;
}
@media (max-width: 768px) {
	.title-middle{
		padding:0;
	}
	.h1wrap{
		flex-wrap: wrap;
		position: relative;
		height: 85vh;
		justify-content: center;
	}
	.nengajo{
		order:1;
	}
	.camp-title{
		order:2;
		flex-basis: 100%;
		width: 100%;
		position: absolute;
		bottom: 0;
		background: rgba(255,255,255,0.8);
		padding: 20px;
	}
	.campname{
		font-size: 30px;
	}

	h1 .red{
		font-size: 22px;
	}
	.camptopwrap{
		width: 100%;
	}
	.camptopwrap h1 img{
		bottom: 120px;
		left: 0;
		right: 0;
		width: 100%;
	}
	.camptop{
		height: 400px;
		margin-top: 60px;
		background-size: auto 700px;
		background-position: left 50% top;
	}
	.camptop section h1 img{
		position: inherit;
		width: 100%;
		margin:30px auto 15px;
	}
	.camptop section>img{
		position: inherit;
		margin: 0 auto;
		bottom: -3px;
	}
	.camptop section{
		height: auto;
		width: 100%;
	}
	.campcon>p{
		text-align: left;
		padding: 10px;
		margin: 10px 0 20px;
		display: inline-block;
	}
	.campaignprice p:first-of-type{
		margin-bottom: 5px;
	}
	.campaignprice img:nth-of-type(2){
		width: 85%;
	}
	.campaignmerit, .campaignrecommend{
		width: 95%;
		margin: 0 auto;
		float: none;
		padding: 10px 0px 15px;
	}
	.campaignmerit{
		border-right: none;
		border-bottom: 2px dashed #0C5AB2;
	}
	.none{
		display: none;
	}
	.campaigncontent{
		border: 7px solid #0C5AB2;
		border-radius: 20px;
	}
	.campaigncontent>a{
		width: 95%;
	}
	.campcon{
		width: 100%;
	}
	.campaignprice .present{
		font-size: 17px;
	}
	.campcontent p{
		width: 95%;
		margin: 0 auto;
	}
	.campaignmeritrecommend{
		width: 95%;
		margin: 0 auto 20px;
	}
	.linklist{
		flex-wrap: wrap;
	}
	.link-item1{
		margin: 0 0 10px 0;
	}
	.link-item{
		width: 90%;
	}
	.top1{
		border-right: 4px solid rgba(60,136,220,0.70);
	}
/*	2つ目のキャンペーン装飾レスポンシブ
*/
	.camp-title2{
		width: 95%;
		padding: 20px 10px;
	}
	.narimashita{
		line-height: 1.3;
	}
	.sub-p{
		line-height: 1.3;
	}
	.camp-h1-2{
		padding-bottom: 5px;
	}
	.sub-h1-2{
		font-size: 18px;
	}
	.campname2{
		font-size: 28px;
	}
	.r-br{
		display: block;
	}
	.pack-content{
		width: 95%;
		font-size: 22px;
	}
	.pack-item{
		line-height: 1.2;
	}
}