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

/* ============================
		Reset
 ============================ */

/*
@font-face {
  font-family: "lowline-only";
  src: local("Hiragino Sans"), local("Hiragino-Sans"), local("游ゴシック体"),
    local("YuGothic"), local("Meiryo"), local("Meiryo UI"), local("メイリオ");
  unicode-range: U+005F, U+FF3F;
}
*/

* { margin:0;padding:0;}

html {
margin: 0;
padding: 0;
border: 0;
outline: 0;
font-size: 62.5%;
vertical-align: baseline;
background: transparent;
}

body, div,span, object, iframe,
h1, h2, h3, h4, h5, h6, p, blockquote, pre,
abbr, address, cite, code,
del, dfn, em, img, ins, kbd, q, samp,
small, strong, sub, sup, var,
b, i,
dl, dt, dd, ol, ul, li,
fieldset, form, label, legend,
table, caption, tbody, tfoot, thead, tr, th, td,
article, aside, canvas, details, figcaption, figure,
footer, header, hgroup, menu, nav, section, summary,
time, mark, audio, video {
margin: 0;
padding: 0;
border: 0;
outline: 0;
font-size: 1.6rem;
vertical-align: baseline;
background: transparent;
}

body {
/*font-family:"lowline-only", 'BIZ UDPGothic', sans-serif;*/
font-family: -apple-system, "Segoe UI", Segoe UI, "Helvetica Neue", HelveticaNeue, "SF Pro JP", "SF Pro Text", "SF Pro Icons", "Hiragino Kaku Gothic Pro", "ヒラギノ角ゴ Pro W3", メイリオ, Meiryo, "ＭＳ Ｐゴシック", Arial, sans-serif;
background-color:#fff;
font-size: 1.6rem;
line-height:1.0em;
text-align:left;
color: #000;
-webkit-text-size-adjust: 100%;
/*font-feature-settings : "palt" 1;*/
}

.container {
width:100%;
position: relative;
}

a { 
color: #000;
text-decoration:none;
}

a img {
border:0;
text-decoration:none;
}


/*	this is my short cut clear fix.
	with note "display:flex" */
.cfx:before, .cfx:after,.cf:before, .cf:after {
content:"";
display: table;
}
.cfx:after,.cf:after { clear:both; }
.cfx,.cf { *zoom:1; }

/* unnuber list is clear fix */
ul:before, ul:after,ol:before, ol:after {
content:"";
display: table;
}
ul:after,ol:after { clear:both; }
ul,ol { *zoom:1; }

li { list-style:none; }

/* data list is clear fix */
dl:before, dl:after {
content:"";
display: table;
}
dl:after { clear:both; }
dl { *zoom:1; }

header *,
article *,
main *,
footer * {
font-size: 1.6rem;
line-height: 1em;
}





/*	---------------------------
   		display control
	--------------------------- */

/* basic : all hits media class */
.spDisplayNone {}
.tbDisplayNone {}
.pcDisplayNone {}
.smartContainer {}
.spDisplayOn,
.tbDisplayOn,
.pcDisplayOn {
display: none;
}


/* for SP */
@media screen and (max-width: 767px) {
.spDisplayNone {display:none;}
.spDisplayOn {display: inline}
.smartContainer {margin: 0 15px;}
}

/* for TB */
@media screen and (max-width: 945px) and (min-width: 768px){
.tbDisplayNone {display:none;}
.tbDisplayOn {display: inline}
.smartContainer {margin: 0 15px;}
}

/* for PC */
@media screen and (min-width: 946px) {
.container {
margin: 0 auto;
width:946px;
position: relative;
}
.pcDisplayNone {display:none;}
.pcDisplayOn {display: inline}
a:hover {
filter: alpha(opacity=50);
-moz-opacity:0.50;
opacity:0.50;
}
a img:hover {
filter: alpha(opacity=50);
-moz-opacity:0.50;
opacity:0.50;
}


}



/* ============================
		header
 ============================ */

header {
/*background-color: #fa9a00;
background-color: #fdb81e;*/
background-color:#fdb81e;
}
header .siteName {
font-size: 1.6rem;
font-weight: bold;
line-height: 40px;
}


article {
background-color: #fef5e5;
background-image: url("../images/bg_wall002.gif");
background-repeat: repeat-x;
padding-bottom: 40px;
}



/* ============================
		siteNameSection
 ============================ */

.siteNameSection {
padding-top: 15px;
}

.siteNameSection .siteName001 {
text-align: center;
margin-bottom: 1em;
}

.siteNameSection .siteName001 img {
width: 100%;
max-width: 340px;
height: auto;
}

.siteNameSection .catchIllust001 {
text-align: right;
}

.siteNameSection .catchIllust001 img {
width: 245px;
height: auto;
}

.siteNameSection h3 {
font-size: 2.6rem;
font-weight: bold;
line-height: 1.5em;
letter-spacing: 0.025em;
/*

color: #fff;

text-shadow:
2px 2px 0 #ff6600, -2px -2px 0 #ff6600,
-2px 2px 0 #ff6600, 2px -2px 0 #ff6600,
0px 2px 0 #ff6600,  0 -2px 0 #ff6600,
-2px 0 0 #ff6600, 2px 0 0 #ff6600,

2px 1px 0 #ff6600, -2px -1px 0 #ff6600,
-2px 1px 0 #ff6600, 2px -1px 0 #ff6600,
0px 1px 0 #ff6600,  0 -1px 0 #ff6600,
-1px 0 0 #ff6600, 1px 0 0 #ff6600,

1px 2px 0 #ff6600, -1px -2px 0 #ff6600,
-1px 2px 0 #ff6600, 1px -2px 0 #ff6600,
0px 2px 0 #ff6600,  0 -2px 0 #ff6600,
-1px 0 0 #ff6600, 1px 0 0 #ff6600;
*/
margin-bottom:10px;
}

.siteNameSection h3 img {
width: auto;
height: 30px;
}

.siteNameSection .noteList {
margin-bottom: 1.0em;
}

.siteNameSection .noteList li {
font-size: 2.0rem;
font-weight: bold;
line-height: 1.5em;
padding-left: 1em;
background-image: url("../images/fig_list001.svg");
background-repeat: no-repeat;
background-position: left top 6px;
}




/* for SP */
@media screen and (max-width: 767px) {

	.siteNameSection .catchIllust001 {
	position: relative;
	top: 3px;
	}

}

/* for TB */
@media screen and (max-width: 945.5px) and (min-width: 768px){

	.siteNameSection .noteList.second {
	margin-right: 280px;
	line-height: 1.5em;
	}
	
	.siteNameSection .catchIllust001 {
	position: absolute;
	bottom: -18px;
	right: 15px;
	}

}


/* for PC */
@media screen and (min-width: 946px) {

	.siteNameSection {
	padding-top: 50px;
	padding-bottom: 100px;
	position: relative;
	}
	
	.siteNameSection .siteName001 {
	margin-bottom: 30px;
	}

	.siteNameSection .siteName001 img {
	width: 640px;
	max-width: none;
	}

	.siteNameSection .catchIllust001 {
	text-align: left;
	position: absolute;
	bottom: -38px;
	right: 0
	}

	.siteNameSection .catchIllust001 img {
	width: 415px;
	}


	.siteNameSection .noteList.second {
	width: 520px;
	line-height: 1.5em;
	}

	.siteNameSection h3 {
	font-size: 3.2rem;
	}
	
	.siteNameSection h3 img {
	height: 40px;
	}

}


/* ============================
		siteNameSection
 ============================ */

.mainSection {
}

.mainWrap {
border: 6px solid #fa9a00;
border-radius: 30px;
background-color: #fff;
position: relative;
}

.mainSection h2 {
/*background-color: #40ad5d;*/
background-color: #2e8540;
border-top-left-radius: 24px;
border-top-right-radius: 24px;
}

.mainSection h2 span {
display: inline-block;
font-size: 2.4rem;
color: #fff;
line-height: 1.25em;
padding: 15px 15px 15px 75px;
background-image: url("../images/fig_check_mark001.svg");
background-repeat: no-repeat;
background-size: 46px;
background-position: left 15px center;
}

.mainSection .mainList {
}

.mainSection .mainList > li {
position: relative;
padding-left: 0px;
padding-top: 40px;
padding-bottom: 30px;
box-sizing: border-box;
min-height: 113px;
border-bottom: 1px solid #fa9a00;
margin: 0 15px 30px 15px;
}


.mainSection .numberPlate {
position: absolute;
top: 30px;
left: -15px;
width: 40px;
height: 83px;
box-sizing: border-box;
/* 2e8540 
background-color: #2e8540;
border-bottom: 1px solid #fff;
border-top-right-radius: 100%;
border-bottom-right-radius: 100%;
*/
}

.mainSection .numberPlate img {
width: 40px;
}


.mainSection .titleWrap {
padding-left: 35px;
}

.mainSection h3 {
font-size: 2.0rem;
font-weight: bold;
/*color: #40ad5d;
color: #4e8540;*/
color:#2e8540;
line-height: 1em;
margin-bottom: 5px;
}

.mainSection h4 {
font-size: 2.6rem;
font-weight: bold;
line-height: 1.4em;
}
.mainSection h4 .red {
color: #cc3333;
font-size: 2.6rem;
}

.mainSection .illustCut001 {
text-align: center;
padding: 15px 0;
}

.mainSection .illustCut001 img {
max-width: 100%;
}

.mainSection .illustCut002 {
text-align: center;
padding: 15px 0;
}

.mainSection .illustCut002 img {
max-width: 100%;
}

.mainSection .illustCut003 {
text-align: center;
padding: 15px 0;
}

.mainSection .illustCut003 img {
max-width: 100%;
}

.mainSection .illustCut004 {
text-align: center;
padding: 15px 0;
}

.mainSection .illustCut004 img {
max-width: 100%;
}

.mainSection .illustCut005 {
text-align: center;
padding: 15px 0;
}

.mainSection .illustCut005 img {
max-width: 320px;
}

.mainSection .body {
font-size: 1.8rem;
line-height: 1.75em;
}

.mainSection .body .underline {
font-size: 1.8rem;
text-decoration: underline;
}


.mainSection .yesNoButtonList {
display: flex;
justify-content: center;
margin: 30px 0 0 0;
}

.mainSection .yesNoButtonList input[type=radio] {
display: none;
}

.mainSection .yesNoButtonList label {
display: block;
background-color: #fff;
width: 120px;
line-height: 60px;
text-align: center;
font-size: 2.5rem;
font-weight: bold;
border: 2px solid #ccc;
}

.mainSection .yesNoButtonList li:nth-child(1) label {
border-right: none;
border-top-left-radius: 15px;
border-bottom-left-radius: 15px;
}
.mainSection .yesNoButtonList li:nth-child(1) label:has(input[type=radio]:checked) {
background-color: #cc3333;
color: #fff;
border: 2px solid #cc3333;
border-right: none;
}

.mainSection .yesNoButtonList li:nth-child(2) label {
border-top-right-radius: 15px;
border-bottom-right-radius: 15px;
}
.mainSection .yesNoButtonList li:nth-child(2) label:has(input[type=radio]:checked) {
/*background-color: #ccc;*/
background-color: #0066cc;
color: #fff;
}

#calcButton {
text-align: center;
margin: 30px 0;
}



.mainSection .calc-btn {
display: inline-block;
width: calc(100% - 30px);
max-width: 470px;
height: 65px;
line-height: 1.2em;
font-size: 2.4rem;
font-weight: bold;
text-align: center;
box-sizing: border-box;
background-color: #2e8540;
border: none;
outline: none;
color: #fff;
border-radius: 15px;
}

.mainSection .calc-btn:hover {
cursor: pointer;
opacity: 0.5;
}

#calcButton input[type=reset] {
margin-top: 15px;
background-color: #666;
}


.mainSection .illustCut005 .caption005 {
display: block;
margin-top: 1em;
font-size: 2.2rem;
font-weight: bold;
color: #2e8540;
line-height: 1.25em;
}


/* for PC */
@media screen and (min-width: 946px) {

	.mainSection {
	}

	.mainSection .mainWrap {
	top: -80px;
	}

	.mainSection h2 {
	text-align: center;
	padding:  0;
	}

	.mainSection h2 span {
	font-size: 3.2rem;
	line-height: 1.5em;
	padding: 20px 0 20px 75px;
	background-size: 60px;
	background-position: left center;
	text-align: left;
	text-indent: 15px;
	}

	.mainSection .mainList {
	}

	.mainSection .mainList > li {
	padding-top: 50px;
	padding-bottom: 50px;
	min-height:  none;
	margin: 0 30px 0 30px;
	}

	.mainSection .numberPlate {
	position: absolute;
	top: 50px;
	left: -30px;
	background-size: 80px auto;
	background-position: left top;
	width: 80px;
	height: 165px;
	font-size: 6.0rem;
	line-height: 160px;
	padding-right: 15px;
	}
	
	.mainSection .numberPlate img {
	width: 80px;
	}

	

	.mainSection .titleWrap {
	padding-left: 80px;
	height: 168px;
	display: table-cell;
	vertical-align: middle;

	}

	.mainSection h3 {
	width: 100%;
	line-height: 1em;
	margin-bottom: 10px;
	}

	.mainSection h4 {
	width: 100%;
	margin: 0;
	padding: 0;
	font-size: 2.8rem;
	line-height: 1.5em;
	}
	.mainSection h4 .red {
	color: #cc3333;
	font-size: 2.8rem;
	}

	.mainSection .illustCut001 {
	text-align: center;
	padding: 0;
	position: absolute;
	left: 680px;
	bottom: 40px;
	}

	.mainSection .illustCut001 img {
	max-width:  none;
	}


	.mainSection .illustCut002 {
	text-align: center;
	padding: 0;
	position: absolute;
	left: 380px;
	bottom: 50px;
	}

	.mainSection .illustCut002 img {
	max-width:  none;
	}


	.mainSection .illustCut003 {
	text-align: center;
	padding: 0;
	position: absolute;
	left: 700px;
	bottom: 30px;
	}
	
	.mainSection .mainList > li:nth-child(3) {
	padding-bottom: 80px;
	}
	
	.mainSection .mainList > li:nth-child(5) {
	padding-bottom: 140px;
	}

	.mainSection .illustCut003 img {
	max-width:  none;
	}
	
	.mainSection .mainList > li:nth-child(3) .body {
	padding-left: 0;
	}

	.mainSection .illustCut004 {
	text-align: center;
	padding: 0;
	position: absolute;
	left: 430px;
	bottom: 40px;
	}

	.mainSection .illustCut004 img {
	max-width:  none;
	}

	.mainSection .illustCut005 {
	text-align: center;
	padding: 0;
	position: absolute;
	left: 560px;
	bottom: 30px;
	}

	.mainSection .illustCut005 img {
	max-width:  320px;
	}
	
	.mainSection .illustCut005 .caption005 {
	font-size: 2.6rem;
	}
	
	.mainSection .mainList > li:nth-child(5) .body {
	width: 430px;
	padding-left: 0px;
	padding-top: 1em;
	font-size: 2.2rem;
	}

	.mainSection .body {
	font-size: 2.0rem;
	line-height: 1.75em;
	padding-left: 80px;
	}
	
	.mainSection .body .underline {
	font-size: 2.0rem;
	}

	
	.mainSection li:nth-child(1) .body {
	width: 500px;
	}

	.mainSection .yesNoButtonList {
	display: flex;
	justify-content: center;
	margin: 30px 0 0 0;
	position: absolute;
	z-index: 10;
	top: 80px;
	right: 0;
	}
	
	.mainSection li:nth-child(5) .yesNoButtonList {
	top: 50px;
	}

	.mainSection .yesNoButtonList input[type=radio] {
	display: none;
	}

	.mainSection .yesNoButtonList label {
	display: block;
	background-color: #fff;
	width: 120px;
	line-height: 60px;
	text-align: center;
	font-size: 2.5rem;
	font-weight: bold;
	border: 2px solid #ccc;
	}

	.mainSection .yesNoButtonList li:nth-child(1) label {
	border-right: none;
	border-top-left-radius: 20px;
	border-bottom-left-radius: 20px;
	}
	.mainSection .yesNoButtonList li:nth-child(1) label:has(input[type=radio]:checked) {
	background-color: #cc3333;
	color: #fff;
	border: 2px solid #cc3333;
	border-right: none;
	}

	.mainSection .yesNoButtonList li:nth-child(2) label {
	border-top-right-radius: 20px;
	border-bottom-right-radius: 20px;
	}
	.mainSection .yesNoButtonList li:nth-child(2) label:has(input[type=radio]:checked) {
	}
	
	.mainSection .yesNoButtonList label:hover {
 	cursor: pointer;
	}


	.mainSection .calc-btn {
	font-size: 2.8rem;
	height: 90px;
	}

	#calcButton {
	margin: 70px 0;
	}

	#calcButton input[type=reset] {
	margin-top: 0;
	margin-left: 15px;
	max-width: 180px;
	}

}


/* for TB */
@media screen and (max-width: 945.5px) and (min-width: 768px){

	#calcButton input[type=reset] {
	margin-top: 0;
	margin-left: 15px;
	max-width: 180px;
	}

}



/* ============================
		resultSection
 ============================ */

.resultSection {
padding: 40px 0;
display: none;
}

.resultSection .mainWrap {
padding: 15px;
box-sizing: border-box;
}

.resultSection h2 {
display: inline-block;
font-size: 3.8rem;
font-weight: bold;
color: #fff;
line-height: 90px;
width: 150px;
text-align: center;
background-color: #2e8540;
margin-bottom: 30px;
border-radius: 15px;
}

.resultSection .resultMessage {
font-size: 3.0rem;
font-weight: bold;
line-height: 1.5em;
border-bottom: 6px solid #40ad5d;
padding-bottom: 10px;
margin-bottom: 15px;
}
.resultSection .resultMessage span {
font-size: 4.0rem;
font-weight: bold;
color: #cc3333;
margin: 0 0.2em;
}

.resultSection .detailMessage {
font-size: 2.0rem;
font-weight: bold;
line-height: 1.25em;
margin-bottom: 0.75em;
}
.resultSection .detailMessage span {
font-size: 3.2rem;
color: #cc3333;
margin: 0 0.2em;
}

.resultSection .detailMessage span,
.resultSection .detailMessage span input {
font-family: -apple-system, BlinkMacSystemFont, Roboto, "Segoe UI", Segoe UI, "Helvetica Neue", HelveticaNeue, "SF Pro JP", "SF Pro Text", "SF Pro Icons", "Hiragino Kaku Gothic Pro", "ヒラギノ角ゴ Pro W3", メイリオ, Meiryo, "ＭＳ Ｐゴシック", Arial, sans-serif;
font-size: 3.2rem;
font-weight: bold;
color: #cc3333;
border: none;
outline: none;
width: 1em;
text-align: center;
padding: 0;
margin: 0;
}


.resultSection .topLead {
font-size: 1.8rem;
line-height: 1.6em;
}

.resultSection .illust006 {
margin: 20px 0;
text-align: center;
}
.resultSection .illust006 img {
max-width: 100%;
}

.resultSection .resultMainList {
border-top: 1px solid #fa9a00;
padding-top: 30px;
}

.resultSection .resultMainList > li {
position: relative;
border-bottom: 1px solid #fa9a00;
padding-bottom: 30px;
margin-bottom: 30px;
}




.resultSection .numberPlate {
position: absolute;
top: 0;
left: 0;
width: 48px;
height: 48px;
line-height: 48px;
font-size: 3.2rem;
font-weight: bold;
color: #fff;
background-color: #2e8540;
text-align: center;
border-radius: 100%;
}

.resultSection .titleWrap {
padding-left: 60px;
margin-bottom: 20px;
}

.resultSection .resultMainList h3 {
font-size: 2.0rem;
font-weight: bold;
color: #2e8540;
line-height: 1em;
margin-bottom: 5px;
}

.resultSection .resultMainList h4 {
font-size: 2.4rem;
font-weight: bold;
line-height: 1.4em;
}
.resultSection .resultMainList h4 .red {
color: #cc3333;
font-size: 2.4rem;
}

.resultSection .detailBlock dl {
background-color: #fee6bf;
padding: 20px;
border-radius: 15px;
}

.resultSection .detailBlock dt {
width: 90px;
line-height: 45px;
text-align: center;
font-size: 2.0rem;
font-weight: bold;
border-radius: 10px;
margin-bottom: 20px;
background-color: #cc3333;
color: #fff;
}
.resultSection .detailBlock dt.no {
background-color: #0066cc !important;
color: #fff !important;
}

.resultSection .detailBlock dd {
font-size: 1.8rem;
line-height: 1.6em;
}


.resultSection .underline {
text-decoration: underline;
font-size: 1.8rem;
}


#printButton {
text-align: center;
margin: 30px 0;
}

#printButton a {
display: inline-block;
width: calc(100% - 30px);
max-width: 470px;
line-height: 1.2em;
font-size: 2.4rem;
font-weight: bold;
text-align: center;
box-sizing: border-box;
background-color: #2e8540;
border: none;
outline: none;
color: #fff;
padding: 10px 0;
border-radius: 15px;
}

#printButton a:hover {
cursor: pointer;
}


.reloadButton {
text-align: center;
margin: 30px 0;
}

#reloadButton {
-moz-appearance: none;
-webkit-box-sizing: none;
-webkit-appearance: none;
appearance: none;
outline: none;
border: none;
background-color: #666;
font-size: 2.4rem;
font-weight: bold;
color: #fff;
line-height: 1.25em;
width: 100px;
height: 100px;
border-radius: 100px;
}





/* for PC */
@media screen and (min-width: 946px) {

	.resultSection .mainWrap {
	padding: 40px;
	}
	
	.resultSection .topBlock {
	display: flex;
	position: relative;
	padding-bottom: 70px;
	}

	.resultSection h2 {
	align-self: flex-start;
	line-height: 150px;
	
	}
	.resultSection .topBody {
	padding-left: 40px;
	box-sizing: border-box;
	padding-top: 40px;
	}

	.resultSection .resultMessage {
	font-size: 3.8rem;
	margin-bottom: 35px;
	}
	.resultSection .resultMessage span {
	font-size: 6.0rem;
	}

	.resultSection .detailMessage {
	font-size: 2.0rem;
	}
	.resultSection .detailMessage span {
	font-size: 3.4rem;
	}
	.resultSection .detailMessage span input {
	font-size: 3.4rem;
	}


	.resultSection .topLead {
	font-size: 1.8rem;
	line-height: 1.6em;
	width: calc(100% - 140px);
	}

	.resultSection .illust006 {
	margin: 0;
	position: absolute;
	bottom: 20px;
	right: 20px;
	}
	.resultSection .illust006 img {
	max-width: none;
	}

	.resultSection .resultMainList {
	padding-top: 40px;
	}

	.resultSection .resultMainList > li {
	border-bottom: 1px solid #fa9a00;
	padding-bottom: 40px;
	margin-bottom: 40px;
	}


	.resultSection .numberPlate {
	width: 65px;
	height: 65px;
	line-height: 65px;
	font-size: 4.3rem;
	background-size: 65px;
	}

	.resultSection .titleWrap {
	padding-left: 85px;
	}

	.resultSection .detailBlock {
	margin-left: 85px;
	}

	.resultSection .detailBlock dl {
	padding: 40px;
	display: flex;
	}

	.resultSection .detailBlock dt {
	align-self: flex-start;
	width: 90px;
	line-height: 45px;
	border-radius: 10px;
	margin-bottom: 20px;
	}
	.resultSection .detailBlock dt.yes {
	background-color: #cc3333;
	color: #fff;
	}
	.resultSection .detailBlock dt.no {
	background-color: #cccccc;
	}

	.resultSection .detailBlock dd {
	width: calc(100% - 90px);
	box-sizing: border-box;
	font-size: 2.0rem;
	padding-left: 30px;
	}

	.resultSection .underline {
	text-decoration: underline;
	font-size: 2.0rem;
	}


	#printButton {
	margin: 60px 0;
	}

	#printButton a {
	line-height: 65px;
	font-size: 3.2rem;

	}

	#printButton a:hover {
	cursor: pointer;
	}


	.resultSection .container {
	position: relative;
	}

	.reloadButton {
	padding-left: 1em;
	}

	#reloadButton:hover {
	cursor: pointer;
	opacity: 0.5;
	}



}


/* ============================
		footer
 ============================ */

footer {
}

footer .siteName {
font-size: 1.2rem;
text-align: center;
background-color: #fad980;
line-height: 1.2em;
padding: 0.5em 0;
}

footer .copyright {
font-size: 1.2rem;
text-align: center;
line-height: 30px;
background-color: #fdb81e;
}



/* ============================
		other
 ============================ */

/* for SP */
@media screen and (max-width: 767px) {
}

/* for TB */
@media screen and (max-width: 945.5px) and (min-width: 768px){
}

/* for PC */
@media screen and (min-width: 946px) {
}
