@charset "UTF-8";
@import url('https://fonts.googleapis.com/css2?family=Inter&display=swap');
@import url('https://fonts.googleapis.com/css2?family=Noto+Sans+JP:wght@400;700&display=swap');
/*================================================
 *  CSSリセット
 ================================================*/
html,
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,
main,
menu,
nav,
section,
summary,
time,
mark,
audio,
video {
	margin: 0;
	padding: 0;
	border: 0;
	outline: 0;
	font-size: 100%;
	vertical-align: baseline;
	background: transparent;
	font-weight: normal;
}

body {
	line-height: 1;
	font-family: 'Noto Sans JP';

}

article,
aside,
details,
figcaption,
figure,
footer,
header,
hgroup,
menu,
nav,
section {
	display: block
}

ul {
	list-style: none
}

blockquote,
q {
	quotes: none
}

blockquote:before,
blockquote:after,
q:before,
q:after {
	content: none
}

a {
	margin: 0;
	padding: 0;
	font-size: 100%;
	vertical-align: baseline;
	background: transparent
}

del {
	text-decoration: line-through
}

abbr[title],
dfn[title] {
	border-bottom: 1px dotted;
	cursor: help
}

table {
	border-collapse: collapse;
	border-spacing: 0
}

hr {
	display: block;
	height: 1px;
	border: 0;
	border-top: 1px solid #ccc;
	margin: 1em 0;
	padding: 0
}

input,
select {
	vertical-align: middle
}


/*================================================
 *  一般・共通設定
 ================================================*/
body {
	font-size: 14px;
	color: #382400;
	/* font-family: "メイリオ", Meiryo, "ヒラギノ角ゴ Pro W3", "Hiragino Kaku Gothic Pro", Osaka, "ＭＳ Ｐゴシック", "MS PGothic", sans-serif; */
	line-height: 1.6;
	/* background:#333; */
}

/* .txtbold{
	font-weight: bold;
}
.txtbold130 {
	font-weight: bold;
	font-size: 130%;
}
.txtblue{
	color: #1B8AFF;
}
.txtred{
	color: #FF0004;
}
.txtredbold{
	color: #FF0004;
	font-weight: bold;
}
.txtglay{
	color: #808080;
}
.txt90{
	font-size: 90%;
}
.divbox{
	padding: 5px 0px;
}
#contents {
	position:relative;
	overflow:hidden;
	width:1200px;
	margin:0 auto;
	background:#fbfbfb;
} */
/* @media screen and (min-width:768px) {
	#contents:before {
		position:absolute;
		top:0;
		left:0;
		width:20%;
		height:100%;
		content: '';
		background:#1f2124;
	}
} */

#main {
	/* box-sizing: border-box;
	float:right;
	width:80%;
	padding:10px; */
}

#mainlogin {
	/* box-sizing: border-box;
	width:100%;
	margin: auto;
	background: #FFFFFF; */
	padding: 15.5rem 0 3rem 0;
}

/* #sub {
	box-sizing: border-box;
	float:left;
	width:20%;
} */
.maincontlogin {
	padding: 10px 10px 30px 10px;
	max-width: 600px;
	margin: 0 auto;
}

.maincont {
	/* margin: 10px 10px 30px 10px; */
}

.maincont2 {
	/* margin: 10px;
	background: #FFFFFF; */

}

footer {
	/* box-sizing: border-box;
	width:1200px;
	margin:0 auto; */
}

a {
	color: #54A734;
}

a:hover {
	color: #2fa279;
}

h1 {
	color: #fbfbfb;
	font-size: 28px;
	line-height: 1.2;
}

h1 a {
	color: #fbfbfb;
	text-decoration: none;
}

h1 a:hover {
	color: #85d1c6;
}

h1.supportlisttitle {
	color: #333333;
	font-size: 28px;
	line-height: 1.2;
	background: #EAF5FF;
	padding: 2px 2px 2px 10px;
	width: 98%;
	border-left: 5px solid #005CA9;
	margin: 1%;
}

h2 {
	font-family: 'Noto Sans JP', sans-serif;
	margin-bottom: 37px;
	font-size: 16.5px;
	color: #333;
	font-weight: bold;
	text-align: center;
}

h2 .title {
	font-family: 'Noto Sans JP', sans-serif;
	display: block;
	color: #404040;
	font-weight: bold;
	font-size: 26px;
}

.content {
	padding: 24px;
	background: #F5F5F4;
	border-radius: 12px;
	max-width: 542px;
	margin: auto;
	margin-bottom: 4rem;
}

.content .note {
	font-family: 'Noto Sans JP', sans-serif;
	font-weight: 400;
	font-size: 14px;
	line-height: 170%;
	letter-spacing: 0.5px;
	color: #404040;
	max-width: 494px;
	margin: auto;
}

.content .note a {
	color: #54A734;
	display: inline-block;
	text-decoration: revert;
}
.content .note a img { 
	margin-left: 4px;
	margin-right: 4px;
}
.content .note a:hover {
	text-decoration: unset;
	
}
.loginError {
	margin: 0 1em 1em 1em;

}

#form1 {
	max-width: 542px;
	margin: 0 auto;
}

#form1 p {
	font-size: 1.6rem;
	color: #404040;
}

#form1 p label {
	font-family: 'Noto Sans JP', sans-serif;
	margin-bottom: 0.9rem;
	display: inline-block;
	font-size: 1.6rem;
	letter-spacing: 0.7px;
}

#form1 input {
	width: 100%;
	border-radius: 8px;
	padding: 1.821rem 2rem;
	border: 1px solid #A3A3A3;
}

#form1 input::placeholder {
	font-family: 'Inter', sans-serif;
	font-size: 1.4rem;
	color: #D4D4D4;
   
}

#form1 input:focus {
	border: 1px solid #0F766E;
}

#form1 input:focus::placeholder {
	color: #D4D4D4;
}

#form1 input:focus-visible {
	outline: 1px solid #0F766E;
}

#form1 .formtxt1 {
	margin-bottom: 2.3rem;
}

#form1 button.type1 {
	border: 1px solid #F17233;
	background: #F17233;
	border: none;
	width: 100%;
	max-width: 542px;
	margin: 0 auto;
	margin-top: 4rem;
	height: 6.4rem;
	margin-bottom: 4rem;
	border-radius: 8px;
}
#form1 button.type1 span {
	font-family: 'Noto Sans JP', sans-serif;
	font-size: 1.6rem;
	display: inline-block;
	letter-spacing: 1px;
	color: #FFFFFF;
	font-weight: 700;
}
#form1 button.type1:hover {
	background: #FFFFFF;
	border: 1px solid #F17233;
	
}
#form1 button.type1:hover span{
	color: #F17233;
}

#form2 {
	max-width: 100%;
	margin: 0 auto;
}

#form2 p {
	font-size: 1.6rem;
	color: #404040;
}

#form2 p label {
	font-family: 'Noto Sans JP', sans-serif;
	margin-bottom: 0.9rem;
	display: inline-block;
	font-size: 1.6rem;
	letter-spacing: 0.7px;
}

#form2 input {
	width: 100%;
	border-radius: 8px;
	padding: 1.821rem 2rem;
	border: 1px solid #A3A3A3;
}

#form2 input::placeholder {
	font-family: 'Inter', sans-serif;
	font-size: 1.4rem;
	color: #D4D4D4;
   
}

#form2 input:focus {
	border: 1px solid #0F766E;
}

#form2 input:focus::placeholder {
	color: #D4D4D4;
}

#form2 input:focus-visible {
	outline: 1px solid #0F766E;
}

#form2 .formtxt1 {
	margin-bottom: 2.3rem;
}

#form2 button.type1 {
	border: 1px solid #F17233;
	background: #F17233;
	border: none;
	width: 100%;
	max-width: 542px;
	margin: 0 auto;
	margin-top: 4rem;
	height: 6.4rem;
	margin-bottom: 4rem;
	border-radius: 8px;
}
#form2 button.type1 span {
	font-family: 'Noto Sans JP', sans-serif;
	font-size: 1.6rem;
	display: inline-block;
	letter-spacing: 1px;
	color: #FFFFFF;
	font-weight: 700;
}
#form2 button.type1:hover {
	background: #FFFFFF;
	border: 1px solid #F17233;
	
}
#form2 button.type1:hover span{
	color: #F17233;
}
p.desc {
	font-family: 'Noto Sans JP', sans-serif;
	font-weight: 400;
	font-size: 14px;
	color: #000000;
	max-width: 544px;
	margin: auto;
	letter-spacing: 0.6px;
	margin-bottom: 8.1rem;
}

p.desc a {
	text-decoration: revert;
}
p.desc a:hover {
	text-decoration: unset;
	color: #54A734;
}
.content-bottom {
	max-width: 543px;
    margin: auto;
}
.content-bottom p.title {
	font-family: 'Noto Sans JP', sans-serif;
	text-align: center;
	color: #404040;
	font-weight: 700;
	font-size: 18px;
	margin-bottom: 1.7rem;
	letter-spacing: 1px;
}	

.content-bottom p.text {
	font-family: 'Noto Sans JP', sans-serif ;
	color: #404040;
	font-weight: 400;
	font-size: 14px;
	letter-spacing: 0.5px;
}
.btn-info {
	text-align: center;
}
.content-bottom .btn {
	font-family: 'Noto Sans JP', sans-serif;
	background: #FFFFFF;
	border: 2px solid #F17233;
	width: 100%;
	max-width: 356px;
	margin: 0 auto;
	margin-top: 4.2rem;
	padding: 0;
	font-size: 1.6rem;
	height: 6.5rem;
	color: #F17233;
	font-weight: 700;
	line-height: 6rem;
    letter-spacing: 0.5px;
	border-radius: 5rem;
	display: inline-block;
}

.content-bottom .btn:hover {
	background: #F17233;
	color: #FFFFFF;
}

h3 {
	margin-bottom: 0.25em;
	padding: 2px 5px 2px 15px;
	color: #fbfbfb;
	font-size: 16px;
	background: #333;
}

h3 a:link,
h3 a:visited {
	color: #fbfbfb;
}

h3 a:hover {
	color: #FFF193;
}

h4 {
	margin-bottom: 0.25em;
	font-size: 16px;
	color: #15adb3;
}

h5 {
	margin-bottom: 0.25em;
	padding: 2px;
	font-size: 16px;
	border-left: 5px solid #15adb3;
	background: #eee;
}

h6 {
	margin-bottom: 0.25em;
	color: #382400;
	font-size: 14px;
	font-weight: bold;
}

/* p {
	margin:0 1em 1em 1em;
} */
/* 
img {
	vertical-align:bottom;
} */

/* em {
	font-weight:bold;
} */

/* strong {
	font-weight:bold;
	color:#d45451;
} */
/* 
pre {
	margin:1em 0;
	padding:1em;
} */

/* blockquote {
	margin-bottom:1em;
	padding:1em;
	border:1px dotted #ddd;
	border-left:5px solid #ddd;
} */

/* ul,ol,dl {
	margin:0 0 1em 0;
}
ul li {
	list-style:disc;
} */
/* ol li {
	list-style:decimal;
}
li {
	margin-left:2em;
} */

/* dt {
	margin-bottom:0.5em;
	border-bottom:1px dotted #ddd;
}
dt:before {
	content:"\0025a0";
}
dd {
	margin-bottom:1em;
} */
/* .hissu1 {
	width:3em;
	margin-left:0.5em;
	padding: 0.1em 0.5em;
	background:#F85355;
	color: #FFFFFF;
} */
/* table.type1 {
	width:100%;
	margin-bottom:1em;
	border-collapse:collapse;
	border:1px solid #ddd;
	background:#fff;
} */
/* table.type1 th {
	padding: 10px;
	text-align: left;
	vertical-align: text-top;
	border: 1px solid #ddd;
	background: #eee;
	width: 20%;
	font-weight: bold;
} */
/* table.type1 td {
	padding:10px;
	text-align:left;
	border:1px solid #ddd;
	width:80%;
}
table.type2 {
	width:100%;
	margin-bottom:1em;
	border-collapse:collapse;
	border:1px solid #ddd;
	background:#fff;
} */
/* table.type2 th {
	padding:10px;
	text-align:center;
	vertical-align:middle;
	border:1px solid #ddd;
	background:#eee;
}
table.type2 td {
	padding:10px;
	text-align:left;
	border:1px solid #ddd;
} */
/* table.type3 {
	width:100%;
	margin-bottom:1em;
	border-collapse:collapse;
	border:1px solid #ddd;
	background:#fff;
}
table.type3 th {
	padding: 5px;
	text-align: left;
	vertical-align: text-top;
	border: 1px solid #ddd;
	background: #eee;
	font-weight: bold;
} */
/* table.type3 td {
	padding:5px;
	text-align:left;
	border:1px solid #ddd;
} */
/* ページネーション */
/* .pagenation	{
	text-align: center;
	width: 90%;
	margin: 30px auto ;
	} */

/* .pagenation ul	{
	display: inline-block;
	margin: 0;
	padding: 0;
	list-style: none;
} */

/* .pagenation li a	{
	display: block;
	margin-left: 5px;
	margin-right: 5px;
	padding: 5px 10px;
	border: solid 1px #aaaaaa;
	color: #000000;
	font-size: 14px;
	text-decoration: none;
} */

/* .pagenation li a.active	{
    background-color: #cccccc;
} */

/* .pagenation li a:hover	{
	background-color: #eeeeee;
} */

/* .pagenation ul:after	{content: "";
	display: block;
	clear: both;}

.pagenation li	{float: left;
	width: auto;} */

/*================================================
 *  ヘッダー
 ================================================*/
/* header {
	position:relative;
	background:#15adb3;
} */

/* header h1 {
	padding:10px;
} */
/* 
.summary {
	margin:0;
	padding:10px;
	color:#ddd;
	background:#23292f;
} */

/*================================================
 *  グローバルナビゲーション
 ================================================*/
/* nav {
	overflow:hidden;
	position:relative;
}
nav h3 {
	display:none;
}
nav ul {
	margin:0;
	padding:0;
}
nav li {
	list-style: none;
	margin: 0;
	padding: 0;
	border-bottom: 1px dotted #494949;
}
nav li a {
	display:block;
	padding:20px;
	color:#fbfbfb;
	text-decoration:none;
	background:#1f2124;
}
nav li a:hover {
	color:#fbfbfb;
	border-left: 8px solid #139095;
	background:#18191b;
	transition:all 0.2s ease 0s;
} */

/*================================================
 *  フッター
 ================================================*/
/* footer {
	clear:both;
} */

/* .footmenu {
	width:100%;
	padding:20px 0;
	overflow:hidden;
	background:#23292f;
} */
/* .footmenu ul {
	position:relative;
	float:left;
	left:50%;
	margin:0;
	padding:0;
} */
/* .footmenu li {
	position:relative;
	left:-50%;
	float:left;
	list-style:none;
	margin:0;
	padding:0 20px;
	font-size:12px;
	text-align:center;
} */
/* .footmenu a {
	color:#13895f;
	text-decoration:none;
}
.footmenu a:hover {
	color:#fbfbfb;
} */

/* .copyright {
	clear:both;
	padding:20px 0;
	font-size:11px;
	text-align:center;
	color:#333e48;
	background:#181d21;
} */

/*================================================
 *  ページトップへの戻り
 ================================================*/
.totop {
	position: fixed;
	bottom: 15px;
	right: 15px;
}

.totop a {
	display: block;
	text-decoration: none;
}

.totop img {
	background: #15adb3;
}

.totop img:hover {
	background: #14c0c5;
}

/*================================================
 *  クラス
 ================================================*/
.textL {
	text-align: left;
}

.textR {
	text-align: right;
}

.list {
	padding: 0 0 0 0.5em;
}

.list li {
	margin: 0;
	padding: 0 0 0 15px;
	list-style: none;
	background: url(../../admin/HTML5_004/images/check.png) 0 5px no-repeat;
}

.info dt {
	border-bottom: none;
}

.info dd {
	padding-bottom: 1em;
	border-bottom: 1px solid #ddd;
}

.service {
	overflow: hidden;
}

.service ul {
	overflow: hidden;
	margin: 1.492% -1.492% 0 0;
}

.service li {
	list-style: none;
	float: left;
	width: 18.507%;
	margin: 0 1.492% 1.492% 0;
}

.service li img {
	width: 100%;
}

.staff {
	overflow: hidden;
}

.staff ul {
	overflow: hidden;
	margin: 1.492% -1.492% 0 0;
}

.staff li {
	list-style: none;
	float: left;
	width: 31.840%;
	margin: 0 1.492% 1.492% 0;
}

.staff li:nth-child(3n+1) {
	clear: both;
}

.staff li img {
	width: 100%;
	margin-bottom: 2.5%;
}

/*================================================
 *  スライドショー
 ================================================*/
.slide {
	position: relative;
	width: 100%;
	overflow: hidden;
	position: relative;
	margin-bottom: 10px;
}

.slideInner {
	list-style: none;
	margin: 0 0 5px 0;
	padding: 0;
}

.slideInner li {
	position: absolute;
	width: 100%;
	background: #fbfbfb;
	margin: 0;
	padding: 0;
}

.slideInner li img {
	width: 100%;
}

.slidePrev {
	position: absolute;
	display: block;
	width: 50px;
	height: 60px;
	left: 0;
	cursor: pointer;
	z-index: 100;
}

.slideNext {
	position: absolute;
	display: block;
	width: 50px;
	height: 60px;
	right: 0;
	cursor: pointer;
	z-index: 100;
}

.controlNav {
	position: relative;
	float: left;
	left: 50%;
}

.controlNav span {
	position: relative;
	left: -50%;
	float: left;
	margin: 5px;
	-webkit-border-radius: 5px;
	-moz-border-radius: 5px;
	border-radius: 5px;
	width: 10px;
	height: 10px;
	overflow: hidden;
	background: #ddd;
	text-indent: -9999px;
	vertical-align: middle;
}

.controlNav span:hover {
	background: #ccc;
	cursor: pointer;
}

.controlNav span.current {
	background: #85d1c6;
}


/*================================================
 *  タブレット向けデザイン
 ================================================*/
/* スクロールバーを考慮して20px大きいサイズで切り替え */


@media screen and (max-width:979px) {
	#contents {
		box-sizing: border-box;
		width: 100%;
	}

	footer {
		width: 100%;
	}
}

/*================================================
 *  スマートフォン向けデザイン
 ================================================*/
@media screen and (max-width:767px) {
	#main {
		float: none;
		width: 100%;
	}

	#mainlogin {
		padding: 8rem 0 1rem 0;
	}

	#mainlogin h2 {
      font-size: 1.7rem;
	  margin-bottom: 2rem;
	}
     .content {
		padding: 1rem 2.4rem;
		max-width: 100%;
		margin-bottom: 4.4rem;
	 }
	.content .note {
		max-width: 100%;
		letter-spacing: 0;
	}
	.maincontlogin {
	    padding: 12px 24px 104px 24px;
	}
	#form1 p label {
		letter-spacing: 0;
	}
	#form1 input {
		padding: 1.82rem 1.5rem;
	}
	.content .note a { 
		display: revert;
	}


	/* #mainlogin h2 span {
      font-size: 31px;
	} */

	#form1 {
		max-width: 100%;
	}
    p.desc {
		max-width: 32.7rem;
		margin-bottom: 8.4rem;
		letter-spacing: 0;
	}
	.content-bottom p.title {
		margin-bottom: 1.1rem;
	}
	.content-bottom {
		max-width: 32.8rem;
	}
	.content-bottom p.text {
		letter-spacing: 0.7px;
	}
	.content-bottom .btn {
		margin-top: 1.2rem;
	}
	.content-bottom p.text {
		letter-spacing: 0.7px;
		padding-left: 0.5px;
		text-align: center;
		line-height: 24px;
	}
	#sub {
		float: none;
		width: 100%;
	}

	nav {
		display: block;
		position: relative;
		width: 100%;
	}

	nav h3 {
		display: block;
		cursor: pointer;
		margin-bottom: 0;
		padding: 10px;
		color: #ddd;
		background: #181d21;
		border: none;
	}

	nav li a {
		padding: 10px 30px;
	}

	#navBtn {
		display: inline-block;
		position: absolute;
		top: 10px;
		right: 10px;
		width: 30px;
		height: 30px;
		border-radius: 5%;
		background: #2a2a2a;
	}

	#navBtnIcon {
		display: block;
		position: absolute;
		top: 50%;
		left: 50%;
		width: 14px;
		height: 2px;
		margin: -1px 0 0 -7px;
		background: #15adb3;
		transition: .2s;
	}

	#navBtnIcon:before,
	#navBtnIcon:after {
		display: block;
		content: '';
		position: absolute;
		top: 50%;
		left: 0;
		width: 14px;
		height: 2px;
		background: #15adb3;
		transition: 0.3s;
	}

	#navBtnIcon:before {
		margin-top: -6px;
	}

	#navBtnIcon:after {
		margin-top: 4px;
	}

	#navBtn .close {
		background: transparent;
	}

	#navBtn .close:before,
	#navBtn .close:after {
		margin-top: 0;
	}

	#navBtn .close:before {
		transform: rotate(-45deg);
		-webkit-transform: rotate(-45deg);
	}

	#navBtn .close:after {
		transform: rotate(-135deg);
		-webkit-transform: rotate(-135deg);
	}

	.service li {
		width: 23.507%;
	}

	.staff li {
		width: 48.507%;
	}

	.staff li:nth-child(2n+1) {
		clear: both;
	}

	.staff li:nth-child(3n+1) {
		clear: none;
		float: left;
	}
}