/* サポートトップページのCSS */

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

/* box-sizingの優先値 */
*,
*::before,
*::after{
    box-sizing: border-box;
}

/* 画像がコンテナを超えないようにするため */
img {
    max-width: 100%;
}

/* テーブルのセル間のスペースを削除します */
table{
    border-collapse: collapse;
}

img,a img{
	border:none;
	background:transparent;
	vertical-align:bottom;
}



html {
	font-size: 62.5%;
	scroll-behavior: smooth;
	scroll-padding-top: 70px;
}
body{
	font-size:1.6rem;
	font-family: "Helvetica Neue",Arial,"Hiragino Kaku Gothic ProN","Hiragino Sans",Meiryo,sans-serif;
}

/*----------------------------------------------------*/


#contents {
	width:800px;
}

#contents h1 {
	text-align:center;
	margin:20px 0;
	padding:20px 0;
	font-size:2.5rem;
	font-weight:bold;
	line-height:150%;
}

#contents h2 {
	margin:20px 0 30px;
	text-align:center;
	font-weight:bold;
}


/*/*
#main h3 {
	text-align:center;
	width:80%;
	margin:50px auto 30px;
	padding:10px;
	background-color: #f6f6f6;
	border-top: 1px solid #ccc;
	border-bottom: 1px solid #ccc;
}
*/

footer {
	width: 800px;
	margin-top:50px;
	border-top: #ccc 1px solid;
	text-align: center;
}

.pancz {
	margin:10px;
	font-size:1.3rem;
}

.pancz a {
	color:#000;
}



/* 汎用ボタン */

/* 楕円 */
.btn-oval {
	position: relative;
	width:300px;
	height:50px;
	margin:5px auto 20px;
	background: #eee;
	border-radius:50px;
	box-shadow: 0 2px 4px rgba(0,0,0,0.3);
	text-align:center;
}

.btn-oval a {
	position: absolute;
	padding:13px;
	top: 0;
	left: 0;
	height:100%;
	width: 100%;
	color:#555;
	font-weight:bold;
	text-decoration:none;
}

.btn-oval a:hover {
	color:#000;
	border-radius:50px;
	background:#f8f4e6;
	text-decoration:none;
}





/* よくあるご質問 */

.faqarea {
	margin:20px 0 50px;
	background:#d9f4ff;
	padding:10px;
}

.commonfaq {
	margin:10px auto;
	width:90%;
}

.cat-i {
	background:#00afcc;
	padding:2px;
	margin-bottom:-10px;
	border-radius:3px;
	font-size:0.6em;
	font-weight:bold;
	display:inline;
	color:#fff;
}

.cat-b {
	background:#e9bc00;
	padding:2px;
	margin-bottom:-10px;
	border-radius:3px;
	font-size:0.6em;
	font-weight:bold;
	display:inline;
	color:#fff;
}

.cat-r {
	background:#009b9f;
	padding:2px;
	margin-bottom:-10px;
	border-radius:3px;
	font-size:0.6em;
	font-weight:bold;
	display:inline;
	color:#fff;
}

.cat-p {
	background:#cab8d9;
	padding:2px;
	margin-bottom:-10px;
	border-radius:3px;
	font-size:0.6em;
	font-weight:bold;
	display:inline;
	color:#fff;
}

.cat-o {
	background:#a9a9a9;
	padding:2px 0 2px 5px;
	margin-bottom:-10px;
	border-radius:3px;
	font-size:0.6em;
	font-weight:bold;
	display:inline;
	letter-spacing:1.3em;
	color:#fff;
}

/* トップへ戻るボタン */
#page_top{
	width: 50px;
	height: 50px;
	position: fixed;
	right: 0;
	bottom: 0;
	background: #ccc;
	opacity: 0.6;
  }
  #page_top a{
	position: relative;
	display: block;
	width: 50px;
	height: 50px;
	text-decoration: none;
  }
  #page_top a::before{
	font-family: 'Font Awesome 5 Free';
	font-weight: 900;
	content: '\f062';
	font-size: 25px;
	color: #fff;
	position: absolute;
	width: 25px;
	height: 25px;
	top: 0;
	bottom: 0;
	right: 0;
	left: 0;
	margin: auto;
	text-align: center;
  }



/* トップページ -------------- */

/* お困りごとからお選びください */

.cat-choice {
	margin:20px auto 50px;
	width:763px;
}

.cat-choice__btn {
	display:inline-block;
	position: relative;
	width:250px;
	height:130px;
	margin-bottom:5px;
	background: #eee;
	border-radius:5px;
	text-align:center;
	border-bottom:2px solid #ddd;
}

.btn2 {
	width:377px;
}

.cat-choice__btn img {
	margin-bottom:5px;
}
.cat-choice__btn a {
	position: absolute;
	padding-top:15px;
	top: 0;
	left: 0;
	height:100%;
	width: 100%;
	color:#444;
	font-weight:bold;
	text-decoration:none;
}

.cat-choice__btn a:hover {
	color:#000;
	border-radius:5px;
	background:#f8f4e6;
	text-decoration:none;
}

.cat-choice-faq {
	margin:10px auto 50px;
	width:780px;
}

.cat-choice-faq__btn {
	position: relative;
	width:500px;
	height:50px;
	margin:10px auto;
	background: #d9f4ff;
	border-radius:5px;
	border-bottom:2px solid #ddd;
}

.cat-choice-faq__btn a {
	position: absolute;
	top:0;
	left:0;
	height:100%;
	width: 100%;
	padding:15px;
	color:#444;
	font-weight:bold;
	text-decoration:none;
}

.cat-choice-faq__btn a:hover {
	color:#000;
	border-radius:5px;
	background:#f8f4e6;
	text-decoration:none;
}



/* 製品サポート */
.pro-sup {
	margin:10px 0;
	padding:10px 0;
}

.pro-sup__inner {
	display: flex;
	margin:0 20px;
	justify-content: center;

}

.pro-sup__item {
	width:50%;
	margin:10px;
	padding: 10px;
	border:#ddd 1px solid;
	background: #fafafa;
}

.pro-sup__item p {
	text-align: center;
}

/* テクニカルサポートについてのご案内 */
.tec-info {
	background: #fafafa;
	margin:30px 0;
	padding:10px 20px;
}

.tec-info p {
	font-size:1.5rem
}

/* サポート比較 */
.tec-info table,
.tec-info table td,
.tec-info table th {
	border:1px solid #aaa;
	padding:5px;
	font-size:1.3rem;
}

.tec-info table {
	border-collapse:collapse;
}

.tec-info table td{
	text-align:center;
	
}

.tec-info table th {
	text-align:left;
}

/* サポート体制変更注記 */

.sup-chginfo {
	margin:20px auto;
	padding:10px;
	border:2px solid #c00;
	background:#fff;
}


/* 製品をお選びください -------------- */
.product-choice {
	width:800px;
	padding:10px;
	background:#d9f4ff;
	border-radius:5px;
}

.product-choice h3 {
	text-align:center;
}

.product-choice hr {
	margin:50px 0;
	border:0;
	border-top: 1px solid #ccc;
}

.catlist {
	margin-bottom:50px;
}


.catlist-list {
	display: -webkit-box;
	display: flex;
	-webkit-justify-content: space-between;
	justify-content: space-between;
	-webkit-flex-wrap: wrap;
	flex-wrap:         wrap;
	font-size: 1.3rem;
	list-style: none;
	margin-left:-30px;
}

.catlist-list li{
	width: 30%;
	margin-bottom: 1em;

}
.catlist-list li a{
	line-height: 1;
	position: relative;
	color:#191970;
	font-weight:bold;
	text-decoration: none;
}

.catlist-list li a:hover {
	text-decoration: underline;
}

.catlist-list li:before {
	font-family: "Font Awesome 5 Free";
	content: '\f0da';
	font-weight: 900;
	color:#000;
	margin-right:10px;
}

.catlist-list::after {
	content: "";
	width: 30%;
}



.product-item {
	margin-bottom:20px;
	padding: 10px;
	background: #fff;
	border-radius:5px;
	box-shadow: 0 2px 4px rgba(0,0,0,0.3);
}

.product-item > h2 {
	margin:0 !important;
	padding-left:5px;
	text-align: left !important;
	font-size: 1.5rem;
	border-bottom: 1px dotted #c7e3fc;
}

.product-item ul {
	list-style: none;
	font-size:1.4rem;
	padding:5px;
}

.product-item ul.col2 {
	display: flex;
	flex-flow: row wrap;
}

.product-item ul li {
	width:50%;
	margin-bottom:10px;
}
.product-item ul li:before {
	font-family: "Font Awesome 5 Free";
	content: '\f138';
	font-weight: 900;
	color:#c5e1fa;
	margin-right:5px;
}

.product-item ul li a {
	text-decoration:none;
	color:#000;
}

.product-item ul li a:hover {
	text-decoration:underline;
}


.searchbox {
	width:95%;
	text-align:center;
	margin:-30px auto 50px;
	padding:20px;
}

.searchbox input[type=text]  {
	font: 18px sans-serif;
	width: 50%;
	padding:5px;
	border: 1px solid #000;
	border-radius: 4px;
	outline: none;
}

.searchbox input[type=button]  {
	border:solid 1px #ccc;
	border-radius:5px;
	padding:5px 10px;
	margin:0;
	font-family:Arial, sans-serif;
	font-size:1.2em;
	font-weight:bold;
	color:#333;
	cursor:pointer;
}



.question {
	margin:5px 0 20px;
	font-size:0.8em;
}






.boxarea {
	margin:20px 0 50px;
	text-align:center;
}

.box1 {
	position: relative;
	width:135px;
	height:120px;
	margin:3px;
	display:inline-block;
	background: #eee;
	border-radius:5px;
	box-shadow: 0 2px 4px rgba(0,0,0,0.3);
	text-align:center;
}

.box1 img {
	margin-bottom:15px;
}

.box1 a {
	position: absolute;
	padding-top:15px;
	top: 0;
	left: 0;
	height:100%;
	width: 100%;
	color:#555;
	font-weight:bold;
	font-size:0.8em;
	text-decoration:none;
	line-height:120%;
}

.box1 a:hover {
	color:#333;
	border-radius:5px;
	background:#f8f4e6;
}




/* 製品アップデート */
.newupdate {
	width:85%;
	margin:10px auto;
	background:#ffffe0;
	padding:5px 10px;
	font-size:0.8em;
}

.date {
	font-weight:bold;
}



.button3 {
	display:inline-block;
	position: relative;
	margin-bottom:10px;
	width:260px;
	height:50px;
	background: #eee;
	border-radius:25px;
	text-align:center;
	box-shadow: 0 2px 4px rgba(0,0,0,0.3);
}

.button3 a {
	position: absolute;
	padding:13px;
	top: 0;
	left: 0;
	height:100%;
	width: 100%;
	color:#555;
	font-weight:bold;
	text-decoration:none;
}

.button3 a:hover {
	color:#000;
	border-radius:25px;
	background:#f8f4e6;
	text-decoration:none;
}



.categoryarea {
	margin:0 0 50px;
	text-align:center;
	border-top:1px dotted #ccc;
}

.box2 {
	position: relative;
	width:200px;
	height:50px;
	margin:5px;
	display:inline-block;
	background:#eee;
	border-radius:50px;
	text-align:center;
	box-shadow: 0 2px 4px rgba(0,0,0,0.3);
}

.box2 a {
	position: absolute;
	padding:13px;
	top: 0;
	left: 0;
	height:100%;
	width: 100%;
	color:#555;
	font-weight:bold;
	text-decoration:none;
}

.box2 a:hover {
	color:#000;
	border-radius:50px;
	background:#f8f4e6;
}

/* お問い合わせ確認事項 */
.chklst {
	margin:20px auto;
	padding:5px 20px;
	width:90%;
	background:#e7f1fb;
	border-radius:10px;

}

.chklst h2 {
	font-size:1.2em;
	text-align:center;
	padding:5px;
	color:#00608d;
}



/* お問い合わせフォームページ */
/*

.form_select {
	margin:0 auto 50px;
	padding:0;
	width:526px;
}
.button2 {
	display:inline-block;
	position: relative;
	width:260px;
	height:50px;
	background: #eee;
	border-radius:5px;
	text-align:center;
	border-bottom:2px solid #ddd;
}

.button2 a {
	position: absolute;
	padding:13px;
	top: 0;
	left: 0;
	height:100%;
	width: 100%;
	color:#555;
	font-weight:bold;
	text-decoration:none;
}

.button2 a:hover {
	color:#000;
	border-radius:5px;
	background:#f8f4e6;
	text-decoration:none;
}
.button4 {
	display:inline-block;
	position: relative;
	width:260px;
	height:130px;
	background: #eee;
	border-radius:5px;
	text-align:center;
	border-bottom:2px solid #ddd;
}

.button4 img {
	margin-bottom:5px;
}
.button4 a {
	position: absolute;
	padding:13px;
	top: 0;
	left: 0;
	height:100%;
	width: 100%;
	color:#555;
	font-weight:bold;
	text-decoration:none;
}

.button4 a:hover {
	color:#000;
	border-radius:5px;
	background:#f8f4e6;
	text-decoration:none;
}

.button5 {
	display:inline-block;
	position: relative;
	width:260px;
	height:130px;
	background: #add8e6;
	border-radius:5px;
	text-align:center;
	border-bottom:2px solid #ddd;
}

.button5 img {
	margin-bottom:5px;
}
.button5 a {
	position: absolute;
	padding:13px;
	top: 0;
	left: 0;
	height:100%;
	width: 100%;
	color:#555;
	font-weight:bold;
	text-decoration:none;
}

.button5 a:hover {
	color:#000;
	border-radius:5px;
	background:#f8f4e6;
	text-decoration:none;
}





.current {
	background:#f8f4e6;
}

.current a {
	color:#000;
}

.rdbarea {
	display:inline-block;
	text-align:center;
}

.rdbtn {
	display: none;
}
.rdlabel {
	background: #eee;
	border-radius:3px;
	box-shadow: 0 1px 4px rgba(0,0,0,0.3);
	padding: 10px;
	width:270px;
	cursor: pointer;
	margin-bottom:10px;
	font-weight:bold;
}

.rdlabel:nth-child(2n) {
	margin-left:10px;
}

.rdbtn:checked + label {
	background:#f8f4e6;
}

.form_select h2 {
	text-align:center;
	color:#212173;
	font-size:1.3em;
	background:#fff;
	padding:5px;
}

.select_area {
	text-align:center;
}
*/




/* よくあるご質問アコーディオン */
/*ボックス全体*/
.accbox {
	margin: 0;
	padding: 0;
}

/*ラベル*/
.accbox label {
	display: block;
	margin: 3px 0;
	padding : 11px 12px;
	color :#333;
	cursor :pointer;
	line-height:150%;
	font-weight:bold;
	background:#fefefe;
}

/* インストール */
.acc-i label {
	border:2px solid #00afcc;
}

/* 購入 */
.acc-b label {
	border:2px solid #e9bc00;
}

/* ユーザー登録 */
.acc-r label {
	border:2px solid #009b9f;
}

/* 製品 */
.acc-p label {
	border:2px solid #cab8d9;
}

/* その他 */
.acc-o label {
	border:2px solid #a9a9a9;
}



/*ラベルホバー時*/
.accbox label:hover {
	background :#f8f4e6;
	color:#333;
}


/*チェックは隠す*/
.accbox input {
	display: none;
}

/*中身を非表示にしておく*/
.accbox .accshow {
	height: 0;
	padding: 0;
	overflow: hidden;
	opacity: 0;
}

/*クリックで中身表示*/
.cssacc:checked + .accshow {
	height: auto;
	padding: 10px 10px 30px 30px;
	opacity: 1;
}

.accshow {
	line-height:180%;
}

/* supinfo_menu ReTaskパーソナル注記 */

.rtp-info {
	width:90%;
	margin:10px auto;
	padding:5px;
	border:2px solid #03a396;
	font-size:0.9em;
	background:#fff;
}

.rtp-hd {
	font-weight:bold;
	text-align:center;
}



/* olタグの入れ子で1-1、1-2表示対応 */
ol {
    counter-reset: count 0;
    list-style-type: none;
}
li:before {
    counter-increment: count 1;
    content: counters(count, "-") ". ";
}