/* ================================================================================== */
/*   Common CSS   */
/* ================================================================================== */
@import url('./ress.css');
@import url('https://fonts.googleapis.com/css2?family=BIZ+UDPGothic&display=swap');
@import url('https://fonts.googleapis.com/css2?family=Material+Symbols+Rounded:opsz,wght,FILL,GRAD@20..48,100..700,0..1,-50..200');

/* ================================================================================== */
/*   Common TAG   */
/* ================================================================================== */
html{ width:100%; }
body{ width:100%; height:100%; color:#555555; background-color:#ebebeb; overflow-y:scroll; font-family:'BIZ UDPGothic',Meiryo,Helvetica,Arial,sans-serif; font-optical-sizing:auto; font-weight:400; font-style:normal; }
pre{ padding:1rem; border-bottom:1px #999999 solid; }
a{ color:#b83333; text-decoration:none; }
a:hover{ cursor:pointer; opacity:0.7; text-decoration:underline; transition:0.3s; }
div{ position:relative; }
img{ display:block; width:100%; height:auto; }
p{ line-height:150%; }

/* Google Font Setting */
.materialSymbolsRounded{ display:inline-block; vertical-align:text-middle; font-size:1.1em; font-family:'Material Symbols Rounded'; font-variation-settings: 'FILL' 0, 'wght' 500, 'GRAD' 0, 'opsz' 48 }

/* Font Style */
.fBold { font-weight:600; }
.fLight{ font-weight:200; }
.cRed  { color:#d83333; }

/* Additional Icon */
.comIconPdf{ display:inline-block; position:relative; }
.comIconPdf:before{ content:'\e415'; font-size:1.1em; position:absolute; top:0; left:-1.2em; font-family:'Material Symbols Rounded'; font-variation-settings: 'FILL' 0, 'wght' 400, 'GRAD' 0, 'opsz' 48 }
.comIconLink{ display:inline-block; position:relative; }
.comIconLink:before{ content:'\e02f'; font-size:1.1em; position:absolute; top:0; left:-1.2em; font-family:'Material Symbols Rounded'; font-variation-settings: 'FILL' 0, 'wght' 400, 'GRAD' 0, 'opsz' 48 }

/* NewsCategory */
.newsCat1{ background-color:#5593d3; }
.newsCat2{ background-color:#5593d3; }
.newsCat3{ background-color:#5593d3; }
.newsCat4{ background-color:#5593d3; }

/*   Button   */
.btn{ display:inline-block; width:100%; height:100%; padding:0.6rem 0.4rem; color:#ffffff; text-decoration:none; background-color:#999999; display:flex; flex-wrap:nowrap; justify-content:center; align-items:center; align-content:center; border-radius:0.2rem; }
.btn.on{ background-color:#006ab8; color:#ffffff; }
.btn > i{ display:inline-block; margin-right:0.2em; font-size:1.3em; font-family:'Material Symbols Rounded'; font-variation-settings:'FILL' 0,'wght' 400,'GRAD' 0,'opsz' 40; }
.btn > p{ display:inline-block; line-height:120%; }
.btn:hover{ cursor:pointer; text-decoration:none; opacity:0.7; transition:0.3s; }
.btnLow{ display:inline-block; width:100%; padding:0.1em 0.2em; color:#ffffff; background-color:#999999; display:flex; flex-wrap:nowrap; justify-content:center; align-items:center; align-content:center; border-radius:0.2rem; }
.btnLow.on{ background-color:#006ab8; color:#ffffff; }
.btnLow > i{ display:inline-block; margin-right:0.2em; font-size:1.2em; font-family:'Material Symbols Rounded'; font-variation-settings:'FILL' 0,'wght' 400,'GRAD' 0,'opsz' 40; }
.btnLow > p{ display:inline-block; line-height:110%; font-size:0.9em; }
.btnLow:hover{ cursor:pointer; opacity:0.7; transition:0.3s; }
.btnRed  { background-color:#c40026; color:#ffffff; }
.btnBlue { background-color:#006ab8; color:#ffffff; }
.btnGreen{ background-color:#008740; color:#ffffff; }

/*===================================================================
 SP
===================================================================*/
@media( max-width:767px )
{
	/* Common */
	.sp{ display:block; }
	.pc{ display:none !important; }









	/* Login */
	.loginHeader{ width:100%; padding:0.6rem 0; background-color:#000000; }
	.loginHeaderLogo{ width:40vw; margin-left:0.6rem; }
	.loginHeaderTitle{ width:94vw; margin:0 auto; margin-top:1rem; background-color:#ffffff; border-radius:0.2rem; }
	.loginHeaderTitle > p{ font-size:1.4rem; padding:1rem 2rem; }
	
	
	
	.loginFormInfoMsg{ width:94vw; margin:0 auto; padding:0.4rem 0.8rem; margin-top:1rem; border:1px #d83333 solid; background-color:#ffffcc; }
	.loginFormInfoMsg > p{ font-size:1.1rem; color:#d83333; }
	
	.loginBodyArea{ width:94vw; margin:0 auto; margin-top:1rem; }
	.loginBodyArea > div:nth-of-type(1){ width:100%; }
	.loginBodyArea > div:nth-of-type(2){ width:100%; margin-top:1rem; }
	
	
	.loginFormArea{ width:100%; padding:0.8rem 1rem; border:1px #666666 solid; background-color:#ffffff; border-radius:0.2rem; }
	.loginFormArea > .title{ color:#666666; font-size:1.4rem; font-weight:600; line-height:100%; }
	.loginInput{ width:100%; margin-top:1rem; display:flex; flex-wrap:wrap; border-bottom:1px #666666 solid; }
	.loginInput > p{ width:100%; line-height:1.6rem; font-weight:600; color:#666666; }
	.loginInput > input{ display:inline-block; width:100%; height:2rem; line-height:2rem; font-size:1.2rem; color:#000066; padding:0 1rem; background-color:#f6f6f6; }
	.loginInput > input:-webkit-autofill{ box-shadow:0 0 0 1000px #f6f6f6 inset; }
	.loginInput > input:hover{ cursor:pointer; background-color:#ffff33; }
	.loginInput > input:focus{ background-color:#ffffcc; }
	.loginBtn{ width:100%; height:3rem; display:flex; flex-wrap:wrap; justify-content:center; align-content:center; margin-top:1rem; border-radius:0.2rem; background-color:#2c328b; }
	.loginBtn > p{ display:inline-block; position:relative; font-size:1.1em; color:#ffffff; }
	.loginBtn > p:before{ content:'\e890'; font-size:1.1em; position:absolute; top:0; left:-1.2em; font-family:'Material Symbols Rounded'; font-variation-settings: 'FILL' 0, 'wght' 400, 'GRAD' 0, 'opsz' 48 }
	.loginBtn:hover{ cursor:pointer; opacity:0.7; transition:0.3s; }
	.loginForgetPw{ text-align:center; margin-top:1rem; }
	.loginForgetPw > a{ color:#666666; }
	.loginNewAddArea{ width:100%; padding:0.8rem 1rem; border:1px #aaaaaa solid; border-radius:0.2rem; background-color:#f9f9f9; }
	.loginNewAddArea > .title{ color:#666666; font-size:1.4rem; font-weight:600; line-height:100%; }
	.loginNewAddArea > .body1{ margin-top:0.8rem; }
	.loginNewAddArea > .body2{ margin-top:1.3rem; }

	.loginBottomArea{ width:100%; padding:0 1rem; margin-top:2rem; }
	.loginFooter{ width:100%; padding:0.4rem 0; border-top:1px #999999 solid; }
	.loginBottomP1{ line-height:100%; font-size:0.8em; color:#666666; font-weight:600; }
	.loginBottomP2{ line-height:120%; margin-top:0.2rem; font-size:0.6em; color:#666666; }
	.loginBottomP3{ line-height:100%; margin-top:0.6rem; font-size:0.6em; color:#666666; text-align:center; }
}
/*===================================================================
 PC
===================================================================*/
@media( min-width:768px )
{
	/* Common */
	body{ font-size:16px; }
	.sp{ display:none !important; }
	.pc{ display:block; }

	/* Login */
	.header{ width:100%; height:3.6rem; display:flex; flex-wrap:nowrap; justify-content:space-between; align-items:center; background-color:#000000; }
	.headerTitle{ height:3rem; display:flex; flex-wrap:nowrap; align-items:center; }
	.headerTitle > img{ width:6rem; margin-left:1rem; }
	.headerTitle > p > span{ display:block; font-size:0.8rem; color:#dddddd; line-height:100%; margin-bottom:0.2rem; }
	.headerTitle > p{ font-size:1.1rem; font-weight:600; color:#ffffff; line-height:100%; margin-left:1rem; }


	.headerUser{}





/* ---------------------------------------------------------- */
/* publicPage */
/* ---------------------------------------------------------- */
.pubHeader{ width:100%; height:2.5rem; position:fixed; top:0; left:0; display:flex; flex-wrap:nowrap; justify-content:space-between; z-index:+20; background-color:#444444; box-shadow:0px 0px 0.4rem 0.2rem #999999; }
.pubHeaderDummy{ clear:both; width:100%; height:4.5rem; }
.pubHeaderTitle > p{ color:#ffffff; height:2.5rem; line-height:2.7rem; font-size:1.4rem; padding-left:2rem; }
.pubHeaderTitle > p > a{ color:#ffffff; }
.pubPageMainAreaWrapper{ max-width:900px; margin:0 auto; padding-bottom:5rem; }

/* ---------------------------------------------------------- */
/* newEntry */
/* ---------------------------------------------------------- */
.newEntryPageTitle{ width:100%; }
.newEntryPageTitle > p:nth-of-type(1){ height:1.3rem; line-height:100%; font-size:1.3rem; font-weight:bold; color:#00416b; }
.newEntryPageTitle > p:nth-of-type(2){ padding-top:0.5rem; }
.newEntryBodyHead{ width:100%; margin-top:2rem; line-height:100%; padding:0.4rem 1rem; background-color:#555555; }
.newEntryBodyHead > p{ color:#ffffff; }
.newEntryBodyInfoMsg{ padding:2rem 0; }
.newEntryBody{ width:100%; display:flex; flex-wrap:nowrap; justify-content:space-between; border-bottom:1px #aaaaaa solid; }
.newEntryBody > div:nth-of-type(1){ width:14rem; }
.newEntryBody > div:nth-of-type(1) > p{ padding:0.6rem 0; padding-left:0.6rem; }
.newEntryBody > div:nth-of-type(2){ flex:1; }
.newEntryBody > div:nth-of-type(2) > p{ display:inline-block; padding:0.7rem 0.5rem; }
.newEntryInfo{ display:block;font-size:0.9rem;margin-top:-0.2rem;margin-bottom:0.2rem; }
.newEntryBodyBottom{ clear:both; margin-top:3rem; width:100%; display:flex; flex-wrap:nowrap; justify-content:space-between; }
.newEntryBodyBottom > div{ width:25%; }
.newEntryResultHead{ width:100%; margin-top:2rem; line-height:100%; padding:0.5rem 1rem; background-color:#0069bc; }
.newEntryResultHead > p{ color:#ffffff; }
.newEntryResultBody{ width:100%; padding:1rem; border-bottom:1px #555555 solid; }
.guidelineChkBody{ border-bottom:1px #aaaaaa solid; }
.guidelineChk{ display:none; }
.guidelineChkLabel{ cursor:pointer; display:inline-block; padding:5px 30px; position:relative; width:auto; }
.guidelineChkLabel:before{ background:#ffffff; border:1px solid #555555; border-radius:0.2rem; content:''; display:block; height:1.3rem; width:1.3rem; position:absolute; top:0.4rem; left:0; }
.guidelineChkLabel:after{ border-right:6px solid #db0101; border-bottom:3px solid #db0101; content:''; display:block; height:1.3rem; width:0.8rem; opacity:0; position:absolute; top:0.1rem; left:0.4rem; transform:rotate(45deg); }
.guidelineChk:checked + .guidelineChkLabel:before{ background:#ffffcc; }
.guidelineChk:checked + .guidelineChkLabel:after { opacity:1; }
.uidChkInfo{ color:#666666; font-weight:bold; position:absolute; top:0; left:40%; }
.uidChkInfo.OK{ color:#19b300; }
.uidChkInfo.NG{ color:#db0101; }



/* ================================================================================== */
/*   Form   */
/* ================================================================================== */
/* Pulldown */
.formSelect{ padding-top:0.4rem; }
.formSelect:before{ content:'\e600'; font-weight:200; font-size:1.8rem; color:#0069bc; position:absolute; top:0.3rem; left:0.2rem; font-family:'Material Symbols Rounded'; z-index:+1; pointer-events:none; }
.formSelect > select{ display:block; margin-bottom:0.3rem; position:relative; width:100%; height:2rem; line-height:2rem; color:#0069bc; padding-left:2rem; background-color:#ffffff; border:1px #cccccc solid; }
.formSelect > select:hover{ cursor:pointer; background-color:#ffff33; }
.formSelect > select:focus{ background-color:#ffffcc; }
/* Text */
.formText{ padding-top:0.4rem; }
.formText > input{ display:inline-block; margin-bottom:0.3rem; width:100%; height:2rem; line-height:2rem; color:#0069bc; padding-left:1rem; background-color:#ffffff; border:1px #cccccc solid; }
.formText > input:hover{ cursor:pointer; background-color:#ffff33; }
.formText > input:focus{ background-color:#ffffcc; }
.formText > input.formTextNum{ width:5rem; text-align:right; padding-right:1rem; }
/* TextArea */
.formText{ padding-top:0.4rem; }
.formText > textarea{ display:inline-block; margin-bottom:0.3rem; width:100%; height:10rem; line-height:2rem; color:#0069bc; padding-left:1rem; background-color:#ffffff; border:1px #cccccc solid; }
.formText > textarea:hover{ cursor:pointer; background-color:#ffff33; }
.formText > textarea:focus{ background-color:#ffffcc; }
/* Radio */
.formRadio{ padding-top:0.4rem; }
.formRadio > label > input{ display:none; }
.formRadio > label > input + p{ display:inline-block; margin-bottom:0.3rem; margin-right:0.3rem; position:relative; width:10rem; height:2rem; line-height:2rem; text-align:center; background-color:#bbbbbb; border-radius:0.2rem; }
.formRadio > label > input + p:hover{ cursor:pointer; opacity:0.7; }
.formRadio > label > input:checked + p{ color:#ffffff; background-color:#0069bc; }
/* CheckBox */
.formCheck{ padding-top:0.4rem; }
.formCheck > label > input{ display:none; }
.formCheck > label > input + p{ display:inline-block; margin-bottom:0.3rem; margin-right:0.3rem; position:relative; width:10rem; height:2rem; line-height:2rem; text-align:center; background-color:#bbbbbb; border-radius:0.2rem; }
.formCheck > label > input + p:hover{ cursor:pointer; opacity:0.7; }
.formCheck > label > input:checked + p{ color:#ffffff; background-color:#0069bc; }




	/* Footer */
	.footer{ clear:both; width:100%; padding:0 1rem; margin-top:4rem; }
	.footerBody{ width:100%; padding:0.4rem 0; display:flex; flex-wrap:wrap; justify-content:space-between; align-items:flex-end; border-top:1px #999999 solid; }
	.footerBottomP1{ line-height:100%; font-size:0.8em; color:#666666; font-weight:600; }
	.footerBottomP2{ line-height:100%; margin-top:0.2rem; font-size:0.6em; color:#666666; }
	.footerBottomP3{ line-height:100%; margin-top:0.2rem; font-size:0.6em; color:#666666; }

	/* Login */
	.loginHeader{ width:100%; height:16rem; display:flex; flex-wrap:nowrap; justify-content:flex-start; align-items:center; align-content:flex-start; background-color:#000000; }
	.loginHeaderLogo{ width:18rem; margin-left:5rem; }
	.loginHeaderTitle{ flex:1; margin-left:5rem; margin-right:5rem; background-color:#ffffff; border-radius:0.2rem; }
	.loginHeaderTitle > p{ font-size:2rem; padding:1rem 2rem; }
	.loginFormInfoMsg{ width:800px; margin:0 auto; padding:0.4rem 0.8rem; margin-top:2rem; border:1px #d83333 solid; background-color:#ffffcc; }
	.loginFormInfoMsg > p{ font-size:1.1rem; color:#d83333; }
	.loginBodyArea{ width:800px; margin:0 auto; margin-top:2rem; display:flex; flex-wrap:wrap; justify-content:space-between; align-items:stretch; }
	.loginBodyArea > div:nth-of-type(1){ width:390px; }
	.loginBodyArea > div:nth-of-type(2){ width:390px; }
	.loginFormArea{ width:100%; height:16rem; padding:0.8rem 1rem; border:1px #666666 solid; background-color:#ffffff; border-radius:0.2rem; }
	.loginFormArea > .title{ color:#666666; font-size:1.4rem; font-weight:600; line-height:100%; }
	.loginInput{ width:100%; margin-top:1rem; display:flex; flex-wrap:nowrap; border-bottom:1px #666666 solid; }
	.loginInput > p{ width:14rem; height:2rem; line-height:2rem; font-weight:600; color:#666666; }
	.loginInput > input{ display:inline-block; width:100%; height:2rem; line-height:2rem; font-size:1.2rem; color:#000066; padding:0 1rem; background-color:#f6f6f6; }
	.loginInput > input:-webkit-autofill{ box-shadow:0 0 0 1000px #f6f6f6 inset; }
	.loginInput > input:hover{ cursor:pointer; background-color:#ffff33; }
	.loginInput > input:focus{ background-color:#ffffcc; }
	.loginBtn{ width:100%; height:3rem; display:flex; flex-wrap:wrap; justify-content:center; align-content:center; margin-top:1rem; border-radius:0.2rem; background-color:#2c328b; }
	.loginBtn > p{ display:inline-block; position:relative; font-size:1.1em; color:#ffffff; }
	.loginBtn > p:before{ content:'\e890'; font-size:1.1em; position:absolute; top:0; left:-1.2em; font-family:'Material Symbols Rounded'; font-variation-settings: 'FILL' 0, 'wght' 400, 'GRAD' 0, 'opsz' 48 }
	.loginBtn:hover{ cursor:pointer; opacity:0.7; transition:0.3s; }
	.loginForgetPw{ text-align:center; margin-top:1rem; }
	.loginForgetPw > a{ color:#666666; }
	.loginNewAddArea{ width:100%; height:16rem; padding:0.8rem 1rem; border:1px #aaaaaa solid; border-radius:0.2rem; background-color:#f9f9f9; }
	.loginNewAddArea > .title{ color:#666666; font-size:1.4rem; font-weight:600; line-height:100%; }
	.loginNewAddArea > .body1{ margin-top:0.8rem; }
	.loginNewAddArea > .body2{ margin-top:1.3rem; }
	.loginBottomArea{ width:100%; padding:0 1rem; position:absolute; bottom:0; left:0; }
	.loginFooter{ width:100%; padding:0.4rem 0; display:flex; flex-wrap:wrap; justify-content:space-between; align-items:flex-end; border-top:1px #999999 solid; }
	.loginBottomP1{ line-height:100%; font-size:0.8em; color:#666666; font-weight:600; }
	.loginBottomP2{ line-height:100%; margin-top:0.2rem; font-size:0.6em; color:#666666; }
	.loginBottomP3{ line-height:100%; margin-top:0.2rem; font-size:0.6em; color:#666666; }
}