@charset "utf-8";
main {
	background-color: #F0F5ED;
	padding-top: 16vw;
}
@media screen and (min-width: 375px) {
	main {
		padding-top: 60px;
	}
}
main .color {
	color: #679E47;
}
#greenballoon {
	margin-top: 30px;
	margin-left: 15px;
	margin-right: 15px;
}
#greenballoon .contents {
	color: #fff;
	position: relative;
	text-align: center;
	font-size: 14px;
	background-color: #679E47;
	border-radius: 20px;
	padding: 8px 15px 20px 15px;
}
#greenballoon .contents::after {
	content: "";
	position: absolute;
	border-top: 12px solid #679E47;
	border-right: 12px solid transparent;
	border-left: 12px solid transparent;
	margin-left: -10px;
	bottom: -12px;
	left: 50%;
}
#greenballoon .contents strong {
	font-size: 20px;
	border-bottom: 4px solid #FFF014;
}
#greenballoon .contents h1 {
	display: none;
}
@media screen and (min-width: 375px) {
	#greenballoon .contents strong {
		font-size: 24px;
	}
}
/*

*/
.mainContents {
	background-color: #fff;
	border-radius: 20px;
	width: calc(100% - 30px);
	margin-top: 30px;
	margin-left: 15px;
	padding-top: 30px;
	padding-bottom: 20px;
}
#nosymptoms {
	background-image: url("../img/selfcheck/illust2.png");
	background-repeat: no-repeat;
	background-position: right 10px bottom;
	background-size: 90px auto;
	padding-bottom: 50px;
}
p.lead {
	font-size: 16.8px;
	letter-spacing: 0.05em;
	display: inline;
	border: 1px solid #679E47;
	border-radius: 20px;
	margin: 0;
	padding: 3px 20px 5px 20px;
}
input[type=checkbox] {
	display: none;
}
label {
	font-size: 16px;
	font-feature-settings: "palt";
	line-height: 1.5;
	display: block;
	margin-top: calc(16 / 375 * 100vw);
}
.flex_wrap {
	padding-top: calc(17 / 375 * 100vw);
}
.checkbox {
	position: relative;
	display: block;
	box-sizing: border-box;
	cursor: pointer;
	width: auto;
	padding: 0 0 0 30px;
}
.checkbox::before {
	content: '';
	position: absolute;
	display: block;
	top: 2px;
	left: 0;
	width: 20px;
	height: 20px;
	background: #fff;
	border: 2px solid #727171;
	border-radius: 4px;
}
.checkbox::after {
	content: '';
	position: absolute;
	display: block;
	top: 4px;
	left: 2px;
	width: 17px;
	height: 15px;
	background-image: url("../img/selfcheck/check.png");
	background-repeat: no-repeat;
	background-position: left top;
	background-size: 100% auto;
	z-index: 5;
	opacity: 0;
}
input[type=checkbox]:checked + .checkbox::before {
	background: #679E47;
	border: 2px solid #679E47;
}
input[type=checkbox]:checked + .checkbox::after {
	opacity: 1;
}
#nosymptoms label {
	margin-top: 40px;
}
.mainContents .box {
	flex-wrap: wrap;
	margin-top: calc(20 / 375 * 100vw);
	margin-bottom: calc(20 / 375 * 100vw);
}
.mainContents .box p {
	width: 22.9%;
	margin-right: 2.6%;
	padding-top: calc(8 / 375 * 100vw);
}
.mainContents .box p:nth-child(4n) {
	margin-right: 0;
}
@media print, screen and (min-width: 769px) {
	.flex_wrap {
		display: flex;
		justify-content: space-between;
		width: 760px;
		margin-left: auto;
		margin-right: auto;
		padding-top: 17px;
	}
	.flex_wrap > div {
		width: 320px;
	}
	.flex_wrap div.box {
		width: 376px;
		margin-top: 0;
		margin-bottom: 50px;
		margin-left: 40px;
		padding-top: 15px;
	}
	.mainContents .box p {
		width: 86px;
		margin-right: 10px;
		padding-top: 10px;
	}
}
/*



*/
.resultArea {
	background-color: #FFFAE1;
	padding: calc(20 / 375 * 100vw) calc(10 / 375 * 100vw);
}
.resultWrap {
	display: none;
}
.resultArea h2 {
	font-size: calc(16 / 375 * 100vw);
	font-weight: 900;
	color: #679E47;
	text-align: center;
	line-height: 2.68;
	position: relative;
}
.resultArea h2::before {
	content: "";
	background-image: linear-gradient(to right, #FFD214, #FFD214 8px, transparent 8px, transparent 16px),
	linear-gradient(to right, #FFD214, #FFD214 8px, transparent 8px, transparent 16px);
	background-size: 16px 2.6px, 16px 2.6px;
	background-position: left top, left bottom;
	background-repeat: repeat-x, repeat-x;
	position: absolute;
	top: 0;
	bottom: 0;
	left: 0;
	right: 0;
	pointer-events: none;
}
.resultArea h3 {
	font-size: calc(11 / 375 * 100vw);
	text-align: center;
	width: 100%;
	padding-top: calc(24 / 375 * 100vw);
}
.resultArea h2.palt,.resultArea h3.palt,.resultArea p.palt {
	font-feature-settings: "palt";
}
.resultArea p.r_lead {
	font-size: calc(12 / 375 * 100vw);
	padding-top: calc(40 / 375 * 100vw);
}
@media print, screen and (min-width: 769px) {
	.resultArea {
		padding: 30px 40px 40px 40px;
	}
	.resultArea h2 {
		font-size: 1.75rem; /*28*/
		line-height: 2.28;
		letter-spacing: 0.05em;
		width: 750px;
		margin: 0 auto;
	}
	.resultArea h2::before {
		background-image: linear-gradient(to right, #FFD214, #FFD214 12px, transparent 12px, transparent 24px),
		linear-gradient(to right, #FFD214, #FFD214 12px, transparent 12px, transparent 24px);
		background-size: 24px 4px, 24px 4px;
	}
	.resultArea h3 {
		font-size: 1.125rem; /*18*/
		width: 750px;
		margin: 0 auto;
		padding-top: 35px;
	}
	.resultArea p.r_lead {
		font-size: 1rem;
		padding-top: 40px;
	}
}
/*

*/
.resultArea .r_img1 {
	width: calc(180 / 375 * 100vw);
	margin-left: auto;
	margin-right: auto;
}
.resultArea .r_img1 p.notosansB {
	color: #E98E00;
	font-size: calc(9.45 / 375 * 100vw);
	padding-top: calc(20 / 375 * 100vw);
}
.resultArea .r_img1 p.notosansB + p {
	padding-top: calc(20 / 375 * 100vw);
}
.resultArea .r_img2 {
	width: calc(252 / 375 * 100vw);
	margin-left: auto;
	margin-right: auto;
}
.resultArea .r_img2 p.notosansB {
	color: #E98E00;
	font-size: calc(9.45 / 375 * 100vw);
	padding-top: calc(20 / 375 * 100vw);
}
.resultArea .r_img2 p.notosansB + p{
	padding-top: calc(10 / 375 * 100vw);
}
.resultArea .r_img2 p.annotation {
	color: #4d4d4d;
	font-size: calc(10 / 375 * 100vw);
	line-height: 1.375;
	width: 166%;
	-webkit-transform: scale(0.6);
	-moz-transform: scale(0.6);
	transform: scale(0.6);/*6*/
	margin-left: -33.3%;
	padding-top: calc(6 / 375 * 100vw);
}
.resultArea .r_img2 p.annotation:nth-of-type(n+4) {
	padding-top: 0 !important;
	margin-top: calc(-10 / 375 * 100vw);
}
.resultArea h4 {
	font-size: calc(8.45 / 375 * 100vw);
	font-weight: 500;
	padding-top: calc(35 / 375 * 100vw);
}
.resultArea .r_link {
	line-height: 1;
	padding-top: calc(4 / 375 * 100vw);
}
.resultArea .r_link a {
	color: #fff;
	line-height: 1.75;
	display: inline-block;
	font-size: calc(8.45 / 375 * 100vw);
	text-align: center;
	font-weight: bold;
	background-color: #679E47;
	border-radius: calc(8 / 375 * 100vw);
	padding: 0 calc(10 / 375 * 100vw);
}
@media print, screen and (min-width: 769px) {
	.resultArea .box_pc {
		position: relative;
		justify-content: space-between;
	}
	.imgwrap {
		width: 720px;
		margin-left: auto;
		margin-right: auto;
	}
	.resultArea .box_pc .r_text {
		order: 1;
		width: 395px;
	}
	.resultArea .r_img1 {
		width: 264px;
	}
	.resultArea .box_pc .r_img1 {
		margin-left: 0;
		margin-right: 40px;
	}
	.resultArea .r_img2 {
		width: 373px;
		margin-left: auto;
		margin-right: auto;
	}
	.resultArea .box_pc .r_img2 {
		margin-left: 0;
		margin-right: 0;
	}
	.resultArea .r_img1 p.notosansB {
		font-size: 0.875rem;
		padding-top: 30px;
	}
	.resultArea .r_img1 p.notosansB + p {
		padding-top: 20px;
	}
	.resultArea .r_img2 p.notosansB {
		font-size: 0.875rem;
		padding-top: 30px;
	}
	.resultArea .r_img2 p.notosansB + p {
		padding-top: 5px;
	}
	.resultArea .r_img2 p.annotation {
		font-size: 0.625rem;
		line-height: 1.375;/*11*/
		width: 125%;
		-webkit-transform: scale(0.8);
		-moz-transform: scale(0.8);
		transform: scale(0.8);/*8*/
		margin-left: -12.5%;
		padding-top: 16px;
	}
	.resultArea .r_img2 p.annotation:nth-of-type(n+4) {
		padding-top: 4px !important;
		margin-top: 0;
	}
	.cttBottom {
		position: absolute;
		bottom: 0;
		left: 0;
	}
	.resultArea h4 {
		font-size: 0.875rem; /*14*/
		display: table-cell;
		padding-right: 10px;
		padding-top: 35px;
		padding-bottom: 5px;
	}
	.resultArea h4.paddingT75 {
		padding-top: 75px !important;
	}
	.resultArea .r_link {
		display: table-cell;
		padding-right: 10px;
		padding-top: 6px;
	}
	.resultArea .r_link a {
		font-size: 0.875rem; /*14*/
		border-radius: 14px;
		padding: 1px 20px 0 20px;
	}
	.resultArea .r_link.orange a:hover {
		background-color: #E98E00;
		opacity: 1;
	}
	.resultArea .r_link.pink a:hover {
		background-color: #DE5780;
		opacity: 1;
	}
	/*
	
	*/
	#result1000 .box_pc {
		padding-bottom: 54px;
	}
	#result1000 .r_img1 {
		order: 2;
	}
	#result0100 .r_img2 {
		order: 2;
	}
	#result1000 h4,#result1000 .r_link {
		display: block;
		padding-right: 0;
	}
	#result0100 h4,#result0100 .r_link {
		display: block;
		padding-right: 0;
	}
}
/*



*/
.submit {
	width: 88%;
	color: #fff;
	font-size: 25px;
	text-align: center;
	display: block;
	background-color: #E98E00;
	border-radius: 40px;
	box-shadow: 0 7px 0 0 #995402;
	margin-top: 20px;
	margin-left: auto;
	margin-right: auto;
	padding: 10px;
}
.pdfDownload {
	background-image: url("../img/selfcheck/icon_download.png");
	background-repeat: no-repeat;
	background-position: 22px center;
	background-size: 32px auto;
	margin-top: 45px;
	padding-left: 45px;
}
#print {
	background-image: url("../img/selfcheck/icon_print.png");
	background-repeat: no-repeat;
	background-position: 50px center;
	background-size: 10vw auto;
	padding-left: 30px;
}
#link_wrap {
	width: 235px;
	margin: 60px auto 0;
}
#backtotop_area a {
	margin-top: 60px;
}
@media screen and (min-width: 375px) {
	.submit {
		width: 330px;
		font-size: 26px;
	}
	#pdfDownload {
		background-position: 25px center;
		background-size: 30px auto;
		padding-left: 48px;
	}
	#print {
		background-position: 50px center;
		background-size: 38px auto;
		padding-left: 30px;
	}
}
/*




*/
@media print, screen and (min-width: 769px) {
	main {
		padding-top: 61px;
	}
	#pankuzu {
		padding-top: 32px;
	}
	.supervision {
		margin-top: -16px;
		padding-top: 0;
	}
	#greenballoon {
		margin-top: 80px;
	}
	#greenballoon .contents {
		width: 940px;
		font-size: 1.625rem; /*26*/
		line-height: 1.6;
		padding: 24px 15px 50px 15px;
	}
	#greenballoon .contents::after {
		border-top: 24px solid #679E47;
		border-right: 24px solid transparent;
		border-left: 24px solid transparent;
		margin-left: -24px;
		bottom: -24px;
	}
	#greenballoon .contents strong {
		font-size: 2rem;
		padding-bottom: 3px;
	}
	/*
	
	*/
	.mainContents {
		width: 940px;
		border-radius: 30px;
		margin-top: 50px;
		margin-left: auto;
		padding: 46px 27px;
	}	
	#nosymptoms {
		background-position: right 40px bottom;
		background-size: 171px auto;
		padding: 40px 150px 90px 150px;
	}
	p.lead {
		font-size: 1.375rem; /*22*/
	}
	label {
		font-size: 1.125rem; /*18*/
		letter-spacing: 0.05em;
		margin-top: 25px;
	}
	#nosymptoms label {
		margin-top: 70px;
	}
	.checkbox {
		padding: 0 0 0 42px;
	}
	.checkbox::before {
		top: 3px;
		width: 25px;
		height: 25px;
	}
	.checkbox::after {
		top: 8px;
		left: 3.5px;
		width: 18px;
		height: 16px;
	}
	/*
	
	*/
	#epi {
		width: 940px;
		margin-left: auto;
		margin-right: auto;
	}
	.lead2 {
		font-size: 1.5rem; /*24*/
	}
	.submit {
		display: inline-block;
		width: 390px;
		font-size: 1.625rem; /*26*/
		margin-top: 60px;
		margin-left: 35px;
		margin-right: 35px;
		transform: translateY(0);
		transition: all .2s;
	}
	.submit:hover {
		transform: translateY(4px);
		box-shadow: 0 4px 0 0 #995402;
		opacity: 0.8;
	}
	.pdfDownload {
		background-position: 40px center;
		background-size: 30px 25px;
		/*margin-top: 60px;*/
		margin: 60px auto 0;
		display: block;
		padding: 13px 10px 13px 60px;
	}
	#print {
		background-position: 55px center;
		background-size: 38px 40px;
		padding: 13px 10px 13px 40px;
	}
	#link_wrap {
		width: 423px;
		margin: 100px auto 0;
	}
	#backtotop_area a {
		margin-top: 100px;
	}
}
/*


IE


*/
@media all and (-ms-high-contrast:none){
	*::-ms-backdrop, #greenballoon .contents {
		line-height: 1.4;
		padding-top: 10px;
		padding-bottom: 30px;
	}
	*::-ms-backdrop, #greenballoon .contents strong {
		line-height: 1.7;
		padding-top: 10px;
		padding-bottom: 0;
		font-family: "Hiragino Sans", "Hiragino Kaku Gothic ProN", Meiryo, "sans-serif";
	}
	*::-ms-backdrop, .resultArea .r_link a {
		line-height: 1;
		padding: 13px 20px 0 20px;
	}
}