@charset "UTF-8";

.hero {
	background-color: #6CBFDE;
	height: 550px;
}

.hero_cnt {
	color: #FFF;
	text-align: center;
	max-width: 615px;
	width: 100%;
	height: 100%;
	margin: 0 auto;
	position: relative;
	padding-top: 100px;
}

.hero_cnt:before {
	content: "";
	display: block;
	position: absolute;
	bottom: -6px;
	left: -32%;
	background-image: url(/campaign/img/corona/img-character01@2x.png);
	background-repeat: no-repeat;
	background-size: contain;
	background-position: center;
	width: 166px;
	height: 218px;
}

.hero_cnt:after {
	content: "";
	display: block;
	position: absolute;
	bottom: -6px;
	right: -32%;
	background-image: url(/campaign/img/corona/img-character02@2x.png);
	background-repeat: no-repeat;
	background-size: contain;
	background-position: center;
	width: 166px;
	height: 218px;
}

.hero_ttl {
	font-size: 60px;
	font-weight: 500;
	line-height: 1.3;
}

.hero_lead {
	font-size: 20px;
	font-weight: 500;
	padding: 10px 0;
	background-color: #248CBA;
	margin-top: 20px;
}

.hero_text {
	margin-top: 20px;
}

.outline {
}

.outline_item {
	padding: 30px 15px;
	width: 100%;
	padding: 55px;
}

.outline_item:nth-child(odd) {
	background-color: #F2F9FC;
}

.outline_item > dt,
.outline_item > dd {
	max-width: 750px;
	width: 100%;
	margin: 0 auto;
	padding: 0 15px;
}

.outline_item > dt {
	font-size: 40px;
	font-weight: 500;
	position: relative;
}

.outline_item > dt:before {
	content: "";
	display: block;
	background-repeat: no-repeat;
	background-size: contain;
	background-position: center;
	width: 120px;
	height: 120px;
	position: absolute;
	top: 68%;
	right: 100%;
	transform: translateY(-50%);
	margin-right: 20px;
}

.outline_item.-store > dt {
	color: #98C405;
}

.outline_item.-store > dt:before {
	background-image: url(/campaign/img/corona/icon-store@2x.png);
}

.outline_item.-preview > dt {
	color: #58B8DB;
}

.outline_item.-preview > dt:before {
	background-image: url(/campaign/img/corona/icon-preview@2x.png);
}

.outline_item.-health > dt {
	color: #41B9B0;
}

.outline_item.-health > dt:before {
	background-image: url(/campaign/img/corona/icon-health@2x.png);
}

.outline_item.-coop > dt {
	color: #F87FA5;
}

.outline_item.-coop > dt:before {
	background-image: url(/campaign/img/corona/icon-coop@2x.png);
}

.outline_item > dd {
}

.outline_item_list {
	margin-top: 20px;
}

.outline_item_list > li {
	position: relative;
	padding: 5px 0;
	padding-left: 1.2em;
	text-indent: -1.2em;
}

.outline_item_list > li:before {
	content: "";
	display: inline-block;
	width: 10px;
	height: 10px;
	border-radius: 50%;
	margin-right: 10px;
}

.outline_item_list.-store > li {
	width: 49%;
	display: inline-block;
}

.outline_item_list.-store > li:before {
	background-color: #98C405;
}

.outline_item_list.-preview > li:before {
	background-color: #58B8DB;
}

.outline_item_list.-health > li:before {
	background-color: #41B9B0;
}

.outline_item_list.-coop > li:before {
	background-color: #F87FA5;
}

.online {
	background-image: url(/campaign/img/corona/img-online.jpg);
	background-repeat: no-repeat;
	background-size: cover;
	background-position: center;
	width: 100%;
	position: relative;
	height: 400px;
}

.online:before {
	content: "";
	background-color: rgba(0, 0, 0, .6);
	position: absolute;
	top: 0;
	left: 0;
	width: 100%;
	height: 100%;
}

.online_cnt {
	position: absolute;
	top: 50%;
	left: 50%;
	transform: translate(-50%, -50%);
	color: #FFF;
	text-align: center;
	width: 100%;
}

.omline_catch {
	font-size: 22px;
	font-weight: 500;
	padding: 5px 0;
	max-width: 320px;
	width: 100%;
	margin: 0 auto;
	background-color: #F87FA5;
	position: relative;
}

.omline_catch:after {
	content: "";
	display: inline-block;
	background-image: url(/campaign/img/corona/img-character03@2x.png);
	background-repeat: no-repeat;
	background-size: contain;
	background-position: center;
	width: 89px;
	height: 95px;
	position: absolute;
	bottom: -4%;
	left: 85%;
}

.online_ttl {
	font-size: 35px;
	font-weight: 500;
	margin-top: 12px;
}

.online_lead {
	font-size: 15px;
	margin-top: 8px;
}

.online_more {
	font-size: 17px;
	font-weight: 500;
	max-width: 300px;
	margin: 22px auto 0;
}

.online_more a:hover {
	background: #3A4056;
}

@media screen and (max-width:1030px) {
}

@media screen and (max-width:640px) {
	.hero {
		padding: 40px 10px 140px;
		height: auto;
	}

	.hero_cnt {
		padding-top: 0;
	}

	.hero_cnt:before,
	.hero_cnt:after {
		transform: translateX(-50%);
	}

	.hero_cnt:before {
		bottom: -205px;
		left: 50%;
		width: 94px;
		height: 218px;
		margin-left: -55px;
	}

	.hero_cnt:after {
		bottom: -160px;
		right: auto;
		left: 50%;
		width: 96px;
		height: 126px;
		margin-left: 55px;
	}

	.hero_ttl {
		font-size: 30px;
	}

	.hero_lead {
		font-size: 16px;
	}

	.hero_text {
		text-align: left;
	}

	.outline {
	}

	.outline_item {
		padding: 30px 15px;
	}

	.outline_item.-store {
		padding-top: 40px;
	}

	.outline_item > dt {
		font-size: 24px;
		padding-left: 70px;
		line-height: 1.4;
	}

	.outline_item > dt:before {
		left: 0;
		width: 60px;
		height: 60px;
	}

	.outline_item.-store > dt {
	}

	.outline_item.-store > dt:before {
	}

	.outline_item.-preview > dt {
	}

	.outline_item.-preview > dt:before {
	}

	.outline_item.-health > dt {
	}

	.outline_item.-health > dt:before {
	}

	.outline_item.-coop > dt {
	}

	.outline_item.-coop > dt:before {
	}

	.outline_item > dd {
	}

	.outline_item_list {
		margin-top: 26px;
	}

	.outline_item_list > li {
	}

	.outline_item_list > li:before {
	}

	.outline_item_list.-store > li {
		width: 100%;
		display: block;
	}

	.outline_item_list.-store > li:before {
	}

	.outline_item_list.-preview > li:before {
	}

	.outline_item_list.-health > li:before {
	}

	.outline_item_list.-coop > li:before {
	}

	.online {
		background-position: 15%;
	}

	.online:before {
	}

	.online_cnt {
	}

	.omline_catch {
		font-size: 18px;
	}

	.omline_catch:after {
		width: 65px;
		height: 69px;
		bottom: 3%;
		left: 84%;
	}

	.online_ttl {
		font-size: 24px;
		margin-top: 10px;
	}

	.online_lead {
	}

	.online_more {
	}

}

@media print {
}