/* CSS Document */

body {
	-webkit-text-size-adjust:100%;
	margin:0;
	padding:0;
	font-size:80%;
	}

p,ul,dl {
	margin:0;
	padding:0;
	}

a:link,
a:visited {
	}

a:hover{
	}
	
.cl{
	clear:both;
	line-height:0;
	}

@media screen and (min-width: 768px) {
	
/*---------top-------------*/

a:focus, *:focus {
	outline:none;
}	
.px10{
	font-size:10px !important;
}
.px11{
	font-size:11px !important;
}
.px14{
	font-size:14px !important;
}
.px18{
	font-size:18px !important;
}
.px90 {/*OSUSUMEページ*/
	font-size: 95% !important;
}

h1,h2,h3,h4,p,dl dt,dl dd,ul li {
	color: #5b5b5b;
}
.inline_b {
	display: inline-block;
}
.mb5 {
	margin: 0 0 5px !important;
}
.mb10 {
	margin: 0 0 10px !important;
}
.mb20 {
	margin: 0 0 20px !important;
}
.mb30 {
	margin: 0 0 30px !important;
}
.mb40 {
	margin: 0 0 40px !important;
}


.w350 {
	width: 350px;
}
.max140 {
	}

.bd1 {
	border: 1px solid #ccc;
	box-sizing: border-box !important;
}
.red {
	color: red !important;
}
.blue {
	color: #1352a1 !important;
}

.fab_limited {
	background: #F03;
	color: #FFF;
	padding: 2px 8px 0 8px;
}
.newgif {
	max-width: 30px;
}
.bold {
	font-weight: bold;
}
.t_left {
	text-align:justify !important;
  word-break:break-all; 
  text-justify:inter-ideograph;
  text-justify:inter-character;
  word-wrap:break-word;
  overflow-wrap:break-word;
}
.t_right {
	text-align: right !important;
}
.t_center {
	text-align: center!important;
}

#right .comment_text {/*PC 右・モバイル左寄せ*/
	text-align: right !important;
	margin: 0 0 5px;
	font-size: .9em !important;
}
.comment {
	background: #73a2bd;
	padding: 5px;
	margin: 0 0 10px;
	color: #fff;
	text-align: center !important;
}

.koukin {
	background: #2985f8;
	color: #fff;
	padding: 0 10px;
	font-size: .875em;
	margin: 2px 10px;
	border-radius: 6px;
	display: inline-block;
}
.new {
	background: red;
	color: #fff;
	padding: 0 5px;
	font-size: .875em;
	margin: 0 0 5px 10px;
}

/*.koukin_color {
	background: rgba(41,133,248,1) !important;
	color: #fff !important;
	
}
.antivirus_color {
	background: rgba(30,180,169,1) !important;
	color: #fff !important;
	
}*/
.border {
	border: 1px solid #747474;
	padding: 10px;
}
.padd_10 {
	padding: 10px;
}
/*---------FLEX（オリバーSEKマーク・クオン防災）--------*/

.flex {
	display: flex;
	flex-wrap: nowrap;
	justify-content: space-around;
	align-items: flex-start;
}
.flex p {
	padding: 10px;
	font-size: 1.1em !important;
}
.flex p img {
}

.sek_mark {
	width: 150px !important;
	height: auto;
}
.sek_mark2 {
	width: 260px !important;
	height: auto;
}

/*---------張地トップ-------------*/

.harizi_topbn {
	background: url(img/kizi-top.jpg) no-repeat;
	background-size: contain;
	width: 720px;
	height: 99px;
	margin: 0 0 10px;
	position: relative;
}
.harizi_topbn h2 {
	position: absolute;
	top: 10px;
	left: 15px;
	font-size: 2.0em;
	text-shadow:2px 2px 0 #efefec, -2px -2px 0 #efefec,
              -2px 2px 0 #efefec, 2px -2px 0 #efefec,
              0px 2px 0 #efefec,  0-2px 0 #efefec,
              -2px 0 0 #efefec, 2px 0 0 #efefec;
}
	
/*--------------------------*/	
	
.hariji {
	padding: 10px 0;
}
.hariji ul {
	display: flex;
	flex-wrap: wrap;
	justify-content: space-between;
	margin: 0 0 10px;
}
.hariji ul::after {
	content: "";
	height: 0;
	display: block;
	width: 168px;
}
.hariji ul::before {
	content: "";
	height: 0;
	display: block;
	width: 168px;
	order: 1;
}
.hariji ul li {
	width: 168px;
	border: 1px solid #CCC;
	border-radius: 8px;
	margin: 0 0 15px;
	text-align: center !important;
	padding: 10px;
	display: flex;
	flex-direction: column;
	transition: .3s ease-in-out;
	box-sizing: border-box;
}
.hari_logo {
	width: 100%;
	max-width: 120px !important;
	height: 30px;
	object-fit: contain;
}
.hari_logo2 {
	color:dodgerblue !important;
	font-size: 1.2em !important;
	font-weight: bold;
	margin: 0 0 15px !important;
}

.hariji ul li img:not(.hari_logo) {
	/*width: 160px;
	height: 122px;*/
	width: 100%;
	max-width: 160px;
	height: 120px;
	object-fit: cover;
}
.hariji ul li img:last-of-type{
}
	
.hariji ul li span {
	font-weight: bold;
	font-size: 1.1em;
	color: #5b5b5b;
}
.hariji ul li:hover {
	border: 1px solid #288a35;
	border-radius: 6px;
	opacity: .7;
}

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

.subheadding {
	background: #e1eeda;
	padding: 6px 5px 5px 15px;
	color: #5b5b5b;
	font-weight: bold;
	margin: 10px 0;
	font-size: 1.3em !important;
	border-bottom: 1px solid #6aaa47;
	letter-spacing: .05em;
	}
	
/*--------------------------*/

.maker_catalog {
	display: flex;
	background: #f7f73f7;
	justify-content: space-around;
	margin: 0 0 20px;
	border-radius: 6px;
	padding: 10px 0 0;
	 
}
.sincol{
	width: 30%;
	text-align:center;
	padding: 20px 10px 10px;
	}
.sincol2{
	width: 30%;
	text-align:center;
	padding: 20px 10px 10px;
	}
.sangetsu{
	width: 30%;
	text-align:center;
	padding: 20px 10px 10px;
	}

.sincol img,
.sincol2 img,
.sangetsu img {
	width: 200px;
	height: 200px;
	transition: .3s ease-in-out;
	box-shadow: rgba(0, 0, 0, 0.12) 0px 1px 3px, rgba(0, 0, 0, 0.24) 0px 1px 2px;
}
.sincol img:hover,
.sincol2 img:hover,
.sangetsu img:hover {
	opacity: .7; 
}

/* showroom */

.show {
	display: flex;
	padding: 20px 0;
	margin: 0 0 10px;
	}
.show_item {
	margin: 0 30px 0 0;
	}
.show_item p:first-of-type {
	font-size: 1.2em;
	font-weight: bold;
	margin: 0 0 5px;
	}
.show_item p {
	font-size: 1.1em;
	margin: 0 0 10px;
	color: #5b5b5b;
	}
	
/*-------------------------*/	

.hariji_show {
	box-sizing: border-box;
	margin: 10px 0 0;
	width: 720px;
	height: 360px;
	background: #f1f1f1;
	border-radius: 6px;
	padding: 20px;
}
.hariji_show a {
	height: 300px;
	width: 300px;
	margin: 0 auto;
	display: block;
	text-align: center;
	transition: .3s ease-in-out;
	box-shadow: rgba(0, 0, 0, 0.12) 0px 1px 3px, rgba(0, 0, 0, 0.24) 0px 1px 2px;
}
.hariji_show a:hover{
	opacity: .7;
}

/*------------各張地ページ-----------*/

#Hmain{
	display: flex;
	justify-content: space-around;
	width:840px;
	box-sizing: border-box;
	margin: 10px auto 0;
	font-family: "ヒラギノ角ゴ Pro W3", "Hiragino Kaku Gothic Pro", "メイリオ", Meiryo, Osaka, "ＭＳ Ｐゴシック", "MS PGothic", sans-serif;
	}

#left{
	/*float:left;*/
	width:170px;	
	}
	
#left h1{
	font-size: 14px;
	color: #5b5b5b;
	text-align: center;
	margin: 0 0 10px;
	}
#left h1 a{
	color: #666;
	display: block;
	text-decoration: none;
	transition: .3s ease-in-out;
	}
#left h1 a:hover{
	color: #999;
	text-decoration: none;
	}

.topindex {
	padding: 10px 0;
}
	
/*#left h2{
	background:#F3F5E7;
	color:#62523E;
	font-size:14px;
	margin:0 0 0 0;
	padding:3px 0 2px 16px;
	letter-spacing:0.1em;
	}*/
	
#navi{
	border-top:solid 1px #CCCCCC;
	border-left:solid 1px #CCCCCC;
	border-right:solid 1px #CCCCCC;
	border-bottom:solid 1px #CCCCCC;
	width:160px;
	margin:0 10px 20px 0;
	}
/*#navi h2 {
	}
	*/
	
#navi ul{
	list-style-type:none;
	text-align: left;
	}

	
#navi ul li{
	border-bottom:dashed 1px #CCCCCC;
	}

#navi ul li:first-of-type {
	font-weight: bold;
	padding: 7px 0 7px 15px;
	font-size: .9rem;
	background: #f3f5e7;
	}	
	
	
#navi ul li.now{
	background:#F3EDD3;
    pointer-events: none;
	}
	
#navi ul li.nob{
	border:none;
	}
	
	#navi ul li:last-of-type {
	border:none;
	}	
	
	
#navi ul li a {
	display: block;
	padding: 5px 0 5px 15px;
	line-height: 2.2;
	text-decoration: none;
	transition: .3s ease-in-out;
	}
#navi ul li a::before {
	content: '';
	display: inline-block;
	width: 12px;
	height: 12px;
	background-image: url(../img/dotarrow.svg);
	background-size: contain;
	vertical-align: middle;
	margin: 0 2px 2px 0;
	background-repeat: no-repeat;
	
	}
#navi ul li a:hover {
	background:#F3EDD3;
	text-decoration: underline
	}
	
/*------------カタログリンク（クオン）---------------*/
	
.catalog_link {
	clear: both;
	width: 162px;
	background: #f1f1f1;
	padding: 15px 10px;
	box-sizing: border-box;
	margin: 0 0 20px;
}
.catalog_link img {
	width: 128px;
	height: 181px;
	object-fit: cover;
	display: block;
	margin: 0 auto 15px;
	box-shadow: 0 1px 1px rgba(0,0,0,0.12), 
			0 2px 2px rgba(0,0,0,0.12), 
			0 4px 4px rgba(0,0,0,0.12) ;
}
.catalog_link a {
	color: #5b5b5b;
	transition: .3s ease-in-out;
	text-decoration: none;
}
.catalog_link a:hover {
	opacity: .7;
}
.catalog_link a p {
	text-align:justify;
  word-break:break-all; 
  text-justify:inter-ideograph;
  text-justify:inter-character;
  word-wrap:break-word;
  overflow-wrap:break-word;
}

	/*モバイル用*/
	
.footer_catalog_link {
	display: none;
}
/*------------closeボタン----------------*/

.c_btn {
	padding: 4px 12px;
}
.c_btn:hover {
	cursor: pointer;
}
#right form {
	text-align: center;
	margin: 30px 0 20px;
}

/*--------------張地ページ共通-----------*/	

#right{
	float:right;
	min-height: 1000px;
	width:660px;
	margin: 0 0 80px;
	font-family: "ヒラギノ角ゴ Pro W3", "Hiragino Kaku Gothic Pro", "メイリオ", Meiryo, Osaka, "ＭＳ Ｐゴシック", "MS PGothic", sans-serif;
	}
#right h2{
	margin:-5px 0 10px;
	padding:4px 0;
	font-size: 1.6em;
	text-align:center;
	border:dashed 1px #CCCCCC;
	background:#F3EDD3;
	width:660px;
	}

		
#right h4{
	margin: 0 0 5px;
	font-size: 1.1em;
	}	
#right p {
	font-size: 1.0em !important;
	line-height: 1.6;
	text-align:justify;
  word-break:break-all; 
  text-justify:inter-ideograph;
  text-justify:inter-character;
  word-wrap:break-word;
  overflow-wrap:break-word;
	}
	
/*--------------------------*/	

.logomark {
	text-align: right;
	margin: 0 0 5px;
	}
.logomark img {
	width: auto;
	height: 24px;
	}
	
/*--------------------------*/

.hariName {
	background: #f1f1f1;
	padding: 10px;
	/*margin: 20px 0 0 0;*/

	border: solid 1px #ccc;
	border-bottom: none;
	width: 660px;
	box-sizing: border-box;
	}
.hariName h3,
	.hariName_b h3 {
	color: #5b5b5b;
	font-size: 1.25em !important;
	margin: 0 0 5px;
	}
.hariName p,
	.hariName_b p {
	color: #747474;
	font-size: 1.0em !important;
	}
.hariName dl,
	.hariName_b dl {
	margin: 5px 0 0 0;
	}
.hariName dt,
	.hariName_b dt {
	float:left;
	font-size: 1.0em !important;
	color: #747474;
	}
.hariName dd, 
	.hariName_b dd {
	font-size: 1.0em !important;
	text-align: left;
	color: #747474;
	}


.hariName_b {
	background: #f1f1f1;
	padding: 10px;
	border: solid 1px #ccc;
	width: 100%;
	box-sizing: border-box;
	margin: 0 0 10px;
	}	
	
	
/*--------MC（削除予定）--------------------------*/
	
/*.sub_text_l,
.sub_text_f {
	font-size: 1.2em;
	font-weight: bold;
	margin: 5px 0;
	padding: 5px 10px;
	display: inline-block;
	border: 1px solid #ccc;
	background: #fff;
}
.sub_text_l::before,
.sub_text_f::before {
	content: "";
	display: inline-block;
	width: 1.1em;
	height: 1.1em;
	margin: 0 5px 0 0;
	vertical-align: middle;
}
.sub_text_l::before {
	background: #69C;
}
.sub_text_f::before {
	background: #F66;
}*/
	
	.plane {
		color: #5fb36d;
		border: 2px solid #5fb36d;
		border-radius: 6px;
		padding: 2px 6px;
		margin: 0 0 0 10px;
		font-size: .85em;
		background: #fff;
	}	
	.pattern {
		color: #fff;
		border: 2px solid #5fb36d;
		border-radius: 6px;
		padding: 2px 6px;
		margin: 0 0 0 10px;
		font-size: .85em;
		background: #5fb36d;
	}	

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

.hariTable{
	border-collapse: collapse;
	width: 660px;
	margin: 0 0 40px;
	box-sizing: border-box;
	vertical-align: top;
	table-layout: fixed;
	background: #fff;
	}
.hariTable td {
	border:solid 1px #CCCCCC;
	padding: 10px;
	text-align:center;
	word-wrap: break-word;
	color: #5b5b5b;
	font-size: 1.0em !important;
	vertical-align: top;
	}
	
.hariTable td img:not(.pattern_img) {
	width: 100px;
	/*height: auto;*/
	object-fit: cover;
	}
	
/*CRES imgサイズ 統一*/	
	
.cres_fab_size .hariTable td img:not(.pattern_img) { 
	width: 100px;
	height: 60px;
	object-fit: cover;
	border: 1px solid #ccc;
	display:  block;
	margin: 0 auto;
}


/*---------CRES パターンサンプル-------*/
	
.cres_fab_size .pattern_img {
	width: 100% !important;
	max-width: 200px !important;
	height: auto !important;
	margin: 5px auto 0;
	display: block;
	padding: 0;
	box-shadow: 0px 3px 6px 2px rgba(0, 0, 0, 0.2);
}			
/*---------PRO パターンサンプル-------*/

.pattern_img {
	width: 100% !important;
	max-width: 200px !important;
	height: auto !important;
	}
.spec_image {
	width: 100% !important;
	max-width: 400px !important;
	height: auto !important;
	}		
		
/*---------adal パターンサンプル-------*/		
	
.pattern_sample {
	width: 100% !important;
	max-width: 230px !important;
	height: auto !important;
	/*margin: 20px auto 0 !important;*/
		
	}	

/*NAZERO*/

.hariTable_nazero {
	border-collapse: collapse;
	width: 660px;
	margin: 0 0 40px;
	box-sizing: border-box;
	vertical-align: top;
	table-layout: fixed;
	background: #fff;
	}
.hariTable_nazero td {
	border:solid 1px #CCCCCC;
	padding: 10px;
	text-align:center;
	word-wrap: break-word;
	color: #5b5b5b;
	font-size: 1.0em !important;
	vertical-align: top;
	}

.hariTable_nazero td img {
	width: 100px;
	height: 60px;
	object-fit: cover;
	}	
.hariTable_nazero tr:nth-child(even) td {
	text-align: left;
	}	
	
/*---------NAZEROパターンサンプル-------*/

.hariTable_nazero .pattern_img {
	width: 100%;
	max-width: 220px !important;
	height: auto;
	}

.hariTable_nazero tr:first-child td:first-child {
	vertical-align: middle;
	}
			
.red_maru {
	display: inline-block;
	width: 8px;
	height: 8px;
	border-radius: 50%;
	background-color: red;
	margin: 0 4px 0 0;
}	
.blue_maru {
	display: inline-block;
	width: 8px;
	height: 8px;
	border-radius: 50%;
	background-color: blue;
	margin: 0 4px 0 0;
}
.rb_maru {
	margin: 0 0 0 calc(100% - 50px);
}	
	
/*--------各トップページ-----------*/

.hariji_headtxt {
	margin: 30px 0 20px !important;
	color: #5b5b5b;
	background: #f3edd3;
	padding: 10px 20px;
	font-size: 1.35em !important;
}

.hariji_headtxt2 {
	margin: 30px 0 10px !important;
	color: #5b5b5b;
	padding: 0 0 5px;
	font-size: 1.35em !important;
	border-bottom: solid 1px #5b5b5b;
}


	
/*---------------------------------*/	
.table_text {
	font-size: .9em;
	line-height: 1em;
}

/*=========クレス・チェリー・プロ　機能説明===========*/

.kinoubox{
	width:152px;
	border:solid 1px #CCCCCC;
	padding:4px;
	margin: 0 0 40px;
	}
	
.kinou-tit{
	background:#3333CC;
	color:#FFFFFF;
	padding: 5px 5px 5px 10px;
	font-weight:bold;
	}
.kinou{
	background:#E6EBF0;
	color:#526192;
	padding: 5px;
	font-weight:bold;
	margin-top: 5px;
	}
.kinou + dd {
	margin: 5px 0;
	text-align: justify;
	padding: 0 5px;
	text-align: justify;
    word-break: break-all;
    text-justify: inter-ideograph;
    text-justify: inter-character;
    word-wrap: break-word;
    overflow-wrap: break-word;
    text-align-last: left;
	}
.kinoubox_sp {
	display: none;
}

/*----------抗ウイルス-----------*/

.spec_info,
.spec_info2 {
	margin: 20px 0 30px;
}

.spec_info2 h3 {
	color: #1352a1;
	font-size: 1.4em !important;
	margin: 30px 0 !important;
}
.spec_info2 img:nth-of-type(3) {
	padding: 0 40px;
}
.spec_info2 img:nth-of-type(4) {
	padding: 0 40px;
}

.spec_info p {
	text-align: center;
}
	.cres_fab_spec p {
		color: #747474;
	}

.spec_headding {
	background: #1eb4a9;
	padding: 5px 5px 5px 15px;
	font-size: 1.2em;
	color: #f1f1f1;
}

.virus_midashi {
	border-left: 5px solid #1eb4a9;
	border-bottom: 1px solid #1eb4a9;
	padding: 0 0 0 10px;
	color: #1eb4a9;
	font-size: 1.2em !important;
	margin: 0 0 5px;
	text-align: left;
	
}
.virus_midashi + p {
	font-size: 1.1em;
	padding: 5px 0 0;
	margin: 0 0 40px !important;
	text-align: left;	
}
.caution {
	list-style: none;
	line-height: 1.8;
	border: 1px solid #ccc;
	padding: 20px;
	background: #fff;
	text-align: left;
	margin: 0 0 40px;
}

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

.flex_fab {
	display: flex;
	flex-wrap: wrap;
	/*justify-content: space-between;*/
}
.flex_fab p  {
	text-align: center !important;
	margin: 0 20px 0 0;
	
}
.flex_fab p:last-of-type  {
	margin: 0;
	
}
.flex_fab p a {
	/*width: 32%;*/
	text-decoration: none;
}

/*---------oliver・Ys----------*/

.hariTable .ti{
	text-align:left;
	padding-left:8px;
	font-size: 1.05em;
}

.mark_img {
	max-width: 200px !important;
	margin: 5px 0;
}
.fs {
	font-size: 80%;
}

/*-----------オリバー 機能説明--------------*/

.kinou-tit2{
	background: #97A888;
	color:#FFFFFF;
	padding: 5px 0;
	text-align: center;
	font-weight:bold;
	font-size: 15px;
	margin: 0;
	}
.kinoubox2{
	width:152px;
	margin: 20px 0;
	border:solid 1px #CCCCCC;
	padding: 5px 5px 20px;
	clear: both;
	}
	
.kinou2{
	background:#E3FDEF;
	border:solid 1px #6699CC;
	color:#526192;
	padding: 5px;
	font-weight:bold;
	border-radius: 6px;
	}
.kinoubox2 p {
	text-align: justify;
	text-justify: inter-ideograph;
	font-size: .9em;
	margin: 15px 0 10px;
	line-height: 1.6;
}
.kinoubox2 p:nth-child(odd) {
	text-align: justify;
	text-justify: inter-ideograph;
	font-size: 0.9em;
	margin: -5px 0 0;
}
.kinoubox2_sp {
	display: none;
}

.bousai_mark {
	width: 200px !important;
	height: auto;
}

.sample_img {
	width: 220px !important;
	height: auto;
	}
	
/*------------------アダル・ナゼロ--------------------*/
.hariName {
	position: relative;
}
.fabbrand_logo {
	position: absolute;
	top: 10px;
	right: 10px;
	mix-blend-mode: multiply;	
}
.pearltone {
	width: 500px;
}

/*-------張地ページ　お問い合わせ-------------*/

.hari_contact_wrap {
	background: #f1f1f1;
	padding: 30px;
	margin: 20px 0;
	border-radius: 6px;
}
.hari_contact {
	display: flex;
	justify-content: space-around;
	align-items: center;
	
}
.hari_contact_item {
	display: flex;
	flex-direction: column;
	align-items: center;
}
.hari_contact_item p {
	font-weight: bold;
}

.hari_form_button2:hover {
	color: #FFF !important;
	opacity: 0.7;
	box-shadow: 0 0 1px 1px inset #3C0;
	
}
.hari_form_button2:activ {
	box-shadow: 2px 2px inset #3C0;
}
.hari_form_button2 {
	padding: 15px 15px 16px;
	display: block;
	border-radius: 6px;
	border: 2px #FFF solid;
	box-shadow: 0 0 1px 1px #B2B2B2;
	margin: 10px auto 15px;
	color: #FFF !important;
	text-shadow: 1px 1px #333;
	text-align: center;
	width: 216px;
	font-weight: bold;
	transition: .3s ease-in-out;
	text-decoration: none;
	
	background: -webkit-gradient(linear, left top, left bottom, color-stop(0.00, #42ff39), color-stop(1.00, #00a12d));
	background: -webkit-linear-gradient(#42ff39, #00a12d);
	background: -moz-linear-gradient(#42ff39, #00a12d);
	background: -o-linear-gradient(#42ff39, #00a12d);
	background: -ms-linear-gradient(#42ff39, #00a12d);
	background: linear-gradient(#42ff39, #00a12d);
	
}

.hari_tel_button {
	border: 1px solid #7f9a7f;
	box-shadow: 0 1px 1px #CCC;
	padding: 0;
	border-radius: 6px;
	background: #FFF;
	width: 250px;
	box-sizing: border-box;
	display: block;
	margin: 10px auto 15px !important;
	text-align: center;
	
}

.hari_tel_button a {
	display: block;
	cursor: default;
	padding: 0 0 0 15px;
}
.hari_contact_svg {
	width: 30px;
	padding: 0 0 0 6px;
	vertical-align: baseline;
}
.hari_dial_button {
	line-height: 1.1;
	display: inline-block;
	padding: 8px 4px;
}
.hari_dial_txt {
	font-size: 0.75em;
	color: #cd2a2b;
	padding: 4px;
	margin: 0;
	font-weight: bold;
}
.hari_dial_txt_tel {
	font-size: 0.75em;
	color: #cd2a2b;
	padding: 4px;
	margin: 0 0 0 -85%;
}
.hari_contact_tel {
	font-size: 1.5em;
	padding: 4px;
	color: #cd2a2b;
	font-weight: bold;
}


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

.pagetop {
    display: none;
    position: fixed;
    bottom: 30px;
    right: 15px;
	z-index: 100;
}
.pagetop a {
    display: block;
    background-color: #3bbd00;
    text-align: center;
    color: #f7f7f7;
	text-shadow: 1px 1px 1px rgba(0,0,0,.4);
    font-size: 14px;
    text-decoration: none;
    padding: 12px 18px;
    opacity: .9;
	border-radius: 6px;
	transition: .3s ease-in-out;
	box-shadow: 0 1px 1px rgba(0,0,0,0.12), 
			0 2px 2px rgba(0,0,0,0.12), 
			0 4px 4px rgba(0,0,0,0.12) ;
}
.pagetop a:hover {
    display: block;
    background-color: #6ef468;
    text-align: center;
    color: #f7f7f7;
	text-shadow: 1px 1px 1px rgba(0,0,0,.8);
    font-size: 14px;
    text-decoration: none;
    padding:12px 18px;
    opacity: .7;
	border-radius: 6px;
}

/*--------------張地トップページボタン-----------*/

.top_link {
	margin: 40px 0 0;
	height: 80px;
	box-sizing: border-box;
}

.top_link a {
	display: block;
	width: 280px;
    padding: 16px 15px;
	color: #5b5b5b;
	text-align: center;
	text-decoration: none;
	margin: 0 auto;
	font-size: 1.1em;
	font-weight: bold;
    /*background: #f3edd3;*/
    background: #f7e493;
    border-radius: 6px;
    border-top: 1px solid #D9D8BD;
    border-right: 1px solid #D9D8BD;
    border-left: 1px solid #D9D8BD;
    border-bottom: 4px solid #D9D8BD;
	box-shadow: 0 0 2px #D9D8BD;
    transition: all .1s ease-in-out;
}

.top_link a:hover {
	color: #247227 !important;
    border-top: 4px solid #D9D8BD;
    border-right: 1px solid #D9D8BD;
    border-left: 1px solid #D9D8BD;
    border-bottom: 1px solid #D9D8BD;
	box-shadow: 0 0 0 #D9D8BD;
}

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

.leather_link {
	background: #f1f1f1;
	border-radius: 6px;
	margin: 0 0 40px;
	padding: 20px;
}
.leather_link p {
	text-align: center !important;
	font-size: 1.1em !important;
	margin: 0 0 5px;
}
.leather_link p a {
	transition: .3s ease-in-out;
}
.leather_link p a:hover {
	opacity: .7;
}

.leather_txt {
	font-size: 1.15em;
	margin: 10px 0;
}

.opa {
	transition: .3s ease-in-out;
}
.opa:hover {
	opacity: .7;
}

/*-------------------*/
.link_area {
	display: flex;
	justify-content: space-around;
	flex-wrap: nowrap;
	padding: 0 10px 30px;
	margin: -8px 0 30px;
	background: #f5f2e9;
}
	.link_area p {
		width: 30%;
		
	}

.link_button {
	/*background: #3bbd00;*/
	background: #e6931d;
	color: #f7f7f7; 
	box-sizing: border-box;
	font-size: 1.0em;
	font-weight: bold;
	padding: 8px 0;
	display: block;
	height: 100%;
	text-decoration: none;
	text-align: center !important;
	border-radius: 6px;
	box-shadow: 1px 1px 2px #ccc;
	transition: .3s ease-in-out;
}

.link_button:hover {
	opacity: .7;
}

/*-------機能説明　ふきだし--------------*/

.fab_spec_wrap {
  position: relative;
  margin: 15px 0 0;
  text-align: left;
}
.fab_spec {
	line-height: 2.6;
	margin: 0 8px 8px 0;
	word-break: keep-all;
	cursor: pointer;
	transition: .3s ease-in-out;
	padding: 2px 6px;
	background:#E3FDEF;
	color: #5b5b5b;
	border:solid 1px #6699CC;
	font-size: .9em;
	border-radius: 6px;
	
}

.spec {
  position: absolute;
  top: 100%;
  left: 50%;
  transform: translateX(-50%);
  width: 75%;
  padding: 16px;
  margin: 8px 0 0 0;
  border-radius: 6px;
  background: #333;
  color: #fff;
  font-size: .9em;
  z-index: 10000;
  opacity: 0;
  
  
}

.fab_spec:hover + .spec {
  animation: fadeIn .6s ease-out .3s 1 forwards;
}

.fab_spec:hover {
	background: #e1f1f0;
}

/*-----------------フォームボタン----------------------*/

.fab_contact {
	background: #f3edd3;
	padding: 20px;
	margin: 20px 0;
	border-radius: 6px;
	text-align: center;
}
.fab_contact_text {
	font-size: 1.2em !important;
	font-weight: bold;
	display: inline;
}


.fab_form_button {
	padding: 15px;
	display: block;
	margin: 10px auto 15px;
	border-radius: 6px;
	border: 2px #FFF solid;
	box-shadow: 0 0 1px 1px #B2B2B2;
	color: #FFF !important;
	text-shadow: 1px 1px #333;
	text-align: center;
	text-decoration: none;
	width: 280px;
	font-size: 1.1em;
	font-weight: bold;
	/*transition: .3s ease-in-out;*/
	
	background: -webkit-gradient(linear, left top, left bottom, color-stop(0.00, #42ff39), color-stop(1.00, #00a12d));
	background: -webkit-linear-gradient(#42ff39, #00a12d);
	background: -moz-linear-gradient(#42ff39, #00a12d);
	background: -o-linear-gradient(#42ff39, #00a12d);
	background: -ms-linear-gradient(#42ff39, #00a12d);
	background: linear-gradient(#42ff39, #00a12d);
	
}
.fab_form_button:activ {
	box-shadow: 2px 2px inset #3C0;
}
.fab_form_button:hover {
	color: #fff !important;
  	background: #52cc46 !important;
	box-shadow: 0 0 1px 1px inset #3C0;
	
}

/*------------アドバイスマン-------------------*/

.advice {
	color: #247227 !important;
	margin: 10px 0;
}
.advice::before {
	content: '';
	display: inline-block;
	width: 16px;
	height: 20px;
	background-image: url(../planning/img/advice_man.svg);
	background-size: contain;
	background-repeat: no-repeat;
	vertical-align: middle;
	margin: 0 5px 0 0;
}

/*------------フーガSP　Aランク張地 別ウインドウ-------------------*/

.fab_window_wrap {
	background: #f3edd3;
	height: 100vh;
}

.fab_window {
	width: 660px;
	height: 100%;
	margin: 0 auto;
	background: #fff;
}


}

/*PC CSS END*/

/*=============================================モバイル====================================================*/

@media screen and (max-width: 767px) {
	
*{
	margin:0;
	padding:0;
}
*, *:before, *:after {
	  -moz-box-sizing: border-box;
	  -webkit-box-sizing: border-box;
	  box-sizing: border-box;
}
img{
	max-width:100%;
	width:100%;
	height:auto;
	border: 0;
}
.px10{
	font-size:10px;
}
.px11{
	font-size:11px;
}
.px14{
	font-size:14px !important;
}
.px18{
	font-size:18px !important;
}
.font_size1 {
	/*font-size: 1.1em !important;*/
}

h1,h2,h3,h4,p,dl dt,dl dd,ul li {
	color: #5b5b5b;
}
.inline_b {
	display: inline-block;
}

h1,h2,h3,p,dl dt,dl dd,ul li {
	color: #5b5b5b;
}

.inline_b {
	display: inline-block;
}

.mb5 {
	margin: 0 0 5px !important;
}
.mb10 {
	margin: 0 0 10px !important;
}
.mb20 {
	margin: 0 0 20px !important;
}
.mb30 {
	margin: 0 0 30px !important;
}
.mb40 {
	margin: 0 0 40px !important;
}
.bd1 {
	border: 1px solid #ccc;
}

.w350 {
	max-width: 350px;
	width: 100%;
	height: auto
}

.max140 {
	max-width: 140px;
	width: 100%;
	height: auto
	}	
	

.red {
	color: red !important;
}
.blue {
	color: #1352a1 !important;
}

.fab_limited {
	background: #F03;
	color: #FFF;
	padding: 2px 8px 0 8px;
}

.newgif {
	max-width: 30px !important;
}

.bold {
	font-weight: bold;
}

.t_left {
	text-align:justify !important;
  word-break:break-all; 
  text-justify:inter-ideograph;
  text-justify:inter-character;
  word-wrap:break-word;
  overflow-wrap:break-word;
}

.t_right {
	text-align:right !important;
}
.t_center {
	text-align: center !important;
}

.comment_text {
	text-align: right !important;
	margin: 0 0 5px;
	font-size: .9em !important;
}

.comment {
	background: #73a2bd;
	padding: 5px;
	margin: 0 0 10px;
	color: #fff;
	text-align: center !important;
}


.koukin {
	background: #2985f8;
	color: #fff;
	padding: 0 10px;
	font-size: .875em;
	margin: 2px 10px;
	border-radius: 6px;
	display: inline-block;
}

.new {
	background: red;
	color: #fff;
	padding: 0 5px;
	font-size: .875em;
	margin: 0 0 5px 10px;
	display: inline-block;
}
	
.border {
	border: 1px solid #747474;
	padding: 10px;
}

.padd_10 {
	padding: 20px;
}

/*---------------FLEX（オリバー・クオン防災）-----------------*/

.flex {
	display: flex;
	flex-direction: column;
	align-items: center;
	padding: 10px;
}
.flex p {
	padding: 10px;
	font-size: 1.0em !important;
	line-height: 1.8 !important;
}
.flex p img {
	width: 100%;
	max-width: 200px;
	min-width: 130px;
	height: auto;
}

.sek_mark {
	width: 130px !important;
	height: auto;
}
.sek_mark2 {
	width: 260px !important;
	height: auto;
}

/*---------トップナビリンク---------*/

.harizi_topbn {
	background: url(img/kizi-top.jpg) no-repeat;
	background-size: contain;
	width: 100%;
	height: auto;
	padding-top: 13.75%;
	margin: 0 0 10px;
	position: relative;
}
.harizi_topbn h2 {
	position: absolute;
	top: 2%;
	left: 4%;
	font-size: 1.6em !important;
	text-shadow:2px 2px 0 #efefec, -2px -2px 0 #efefec,
              -2px 2px 0 #efefec, 2px -2px 0 #efefec,
              0px 2px 0 #efefec,  0-2px 0 #efefec,
              -2px 0 0 #efefec, 2px 0 0 #efefec;
}
	
	
/*--------------------------*/	
	
.hariji {
	padding: 10px 0;
}
.hariji ul {
	display: flex;
	flex-wrap: wrap;
	justify-content: space-between;
	margin: 0 0 10px;
}
.hariji ul::after {
	content: "";
	height: 0;
	display: block;
	width: 32%;
}
.hariji ul::before {
	content: "";
	height: 0;
	display: block;
	width: 32%;
	order: 1;
}
.hariji ul li {
	width: 32%;
	border: 1px solid #CCC;
	border-radius: 8px;
	margin: 0 0 15px;
	text-align: center !important;
	padding: 10px;
	display: flex;
	flex-direction: column;
	transition: .3s ease-in-out;
	box-sizing: border-box;
}
.hari_logo {
	width: 100%;
	max-width: 120px !important;
	height: 30px;
	object-fit: contain;
}
.hari_logo2 {
	color:dodgerblue !important;
	font-size: 1.2em !important;
	font-weight: bold;
	margin: 0 0 15px !important;
}

.hariji ul li img:not(.hari_logo) {
	width: 100%;
	max-width: 160px;
	height: 122px;
	object-fit: cover;
	font-size: 0;
}
.hariji ul li img:last-of-type{
}
	
.hariji ul li span {
	font-weight: bold;
	font-size: 1.1em;
	color: #5b5b5b;
}
.hariji ul li:hover {
	border: 1px solid #288a35;
	border-radius: 6px;
	opacity: .7;
}

@media screen and (max-width: 567px) {
	
.hariji ul li {
	width: 48%;
	border: 1px solid #CCC;
	border-radius: 6px;
	margin: 0 0 15px;
	text-align: center;
	padding: 10px 1%;
}
.hariji ul li span {
	font-weight: bold;
	font-size: .9em;
	color: #5b5b5b;
	line-height: 1.1;
}
}

/*---------------------------*/
	.subheadding {
	font-size: 1.2em;
	background: #e1eeda;
	padding: 5px 5px 5px 15px;
	color: #5b5b5b;
	font-weight: bold;
	margin: 10px 0 !important;
	border-bottom: 1px solid #6aaa47;
	letter-spacing: .05em;

}
/*--------------------------*/

.maker_catalog {
	display: flex;
	background: #f7f7f7;
	justify-content: space-around;
	margin: 0 0 20px;
	border-radius: 6px;
	padding: 20px 2%;
	
}	
.sincol,.sincol2,.sangetsu {
	width: 30%;
	font-size: 1.0em;
	text-align: center;
	}

.sincol img,.sincol2 img,.sangetsu img {
	width: 100%;
	height: auto;
	object-fit: contain;
	transition: .3s ease-in-out;
	box-shadow: rgba(0, 0, 0, 0.12) 0px 1px 3px, rgba(0, 0, 0, 0.24) 0px 1px 2px;
}
.sincol img:hover,.sincol2 img:hover,.sangetsu img:hover {
	opacity: .7; 
}

@media screen and (max-width: 414px) {
	
.maker_catalog {
	display: flex;
	justify-content: space-around;
	align-items: center;
	flex-direction: column;
	margin: 0 0 20px;
	border-radius: 6px;
	padding: 20px 2%;
	
}
.sincol,.sincol2,.sangetsu {
	width: 210px;
	font-size: 1.0em;
	text-align: center;
	margin: 0 0 20px;
	}
}

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

/* showroom */
.show {
	display: flex;
	justify-content: space-around;
	margin: 0 0 20px;
	}
	
@media screen and (max-width: 414px) {
	
.show {
	display: flex;
	margin: 0 0 20px;
	flex-direction: column;
	align-items: center;
	}
.show_item:first-of-type img {
	width: 100%;
	max-width: 200px;
	margin: 0 auto 20px;
	display: block;
	}
}

.show_item:first-of-type {
	width: 40%;
	margin: 0 2% 0 0;
	}
.show_item:first-of-type img {
	width: 100%;
	min-width: 140px;
	}
.show_item p:first-of-type {
	font-size: 1.1em;
	margin: 0 0 10px;
	font-weight: bold;
	}
.show_item p {
	font-size: 1.1em;
	margin: 0 0 10px;
	text-align: justify;
	}

/*--------------------------*/	
.hariji_show {
	box-sizing: border-box;
	margin: 10px 0 0;
	width: 100%;
	height: auto;
	background: #f1f1f1;
	border-radius: 6px;
	padding: 20px;
}
.hariji_show a {
	height: auto;
	width: 100%;
	max-width: 300px;
	margin: 0 auto;
	display: block;
	text-align: center;
	transition: .3s ease-in-out;
}
.hariji_show a img {
	box-shadow: rgba(0, 0, 0, 0.12) 0px 1px 3px, rgba(0, 0, 0, 0.24) 0px 1px 2px;
}
.hariji_show a:hover{
	opacity: .7;
}


/*===========モバイル各種張地ページ========*/

#Hmain{
	width:100%;
	padding:0 2%;
	font-family: "ヒラギノ角ゴ Pro W3", "Hiragino Kaku Gothic Pro", "メイリオ", Meiryo, Osaka, "ＭＳ Ｐゴシック", "MS PGothic", sans-serif;
	}
	
#left{
	float:none;
	width:100%;	
	padding: 0;
	overflow:hidden;
	margin-bottom:10px;
	}
	
#left h1{
	margin:0;
	padding:10px 0;
	font-size:16px;
	color:#5b5b5b;
	text-align:center;
	background:#F2F1EC;
	}
#left h1 a{
	color: #666;
	display: block;
	text-decoration: none;
	transition: .3s ease-in-out;
	}
#left h1 a:hover{
	color: #999;
	text-decoration: none;
	}
	
#left h2 {
	background:#F3F5E7;
	color:#62523E;
	font-size:14px;
	margin:0;
	padding:3px 0 2px 16px;
	letter-spacing:0.1em;
	}
	
/*------------メニュー-----------*/	

#navi{
	border:0;
	width:100%;
	margin:0 0 10px;
	display: flex;
	flex-wrap: wrap;
	}
	
#navi ul {
	list-style-type:none;
	width: 50%;
	box-sizing: border-box;
	}
		
#navi ul li:first-of-type {
	font-weight: bold;
	font-size: .9rem;
	background: #f3f5e7;
	padding: 4px 0 4px 14px;
	}
#navi ul li {
	border-bottom:dashed 1px #CCCCCC;
	/*margin:0 0 0 5px;*/
	line-height:1.8;
	}	
	
#navi ul li a {
	display:block;
	padding: 5px 0;
	text-decoration: none;
	font-size: .8rem;
	}

#navi ul li a::before {
	content: '';
	display: inline-block;
	width: 12px;
	height: 12px;
	background-image: url(../img/dotarrow.gif);
	background-size: contain;
	vertical-align: middle;
	margin: 0 2px 2px 0;
	background-repeat: no-repeat;
}

#navi ul li.now{
	background:#F3EDD3;
    pointer-events: none;
	}
#navi ul li.nob{
	border-bottom:dashed 1px #CCCCCC;
	}

	#navi ul li:last-of-type {
	border-bottom:dashed 1px #CCCCCC;
	}		
	
#navi ul li a:hover {
	background:#F3EDD3;
	text-decoration: underline
	}	
	
/*----------------------------------------------*/	

#right{
	clear:both;
	float:none;
	width:100%;
	height: auto;
}

#right > div img {
	max-width: 369px;
}
	
#right h2{
	margin: 0 0 10px;
	padding:8px 0 4px;
	font-size:1.3em;
	text-align:center;
	border:dashed 1px #CCCCCC;
	background:#F3EDD3;
	width:100%;
	}
#right h2 + p img {
	width:100%;
	max-width: 100%;
	height: auto;
	}
		
#right h4{
	font-size: .9em;
	}
		
#right p {
	font-size: 1.0em;
	line-height: 1.6;
	text-align:justify;
  word-break:break-all; 
  text-justify:inter-ideograph;
  text-justify:inter-character;
  word-wrap:break-word;
  overflow-wrap:break-word;
	}
		
/*--------------------------*/

.logomark {
	text-align: right;
	margin: 0 0 5px;
	}
.logomark img {
	width: auto;
	height: 24px;
	}

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

.hariName {
	background:#f1f1f1;
	padding: 3%;
	border: solid 1px #ccc;
	border-bottom: none;
	width:100%;
	}
.hariName h3,
	.hariName_b h3{
	color:#5b5b5b;
	font-size: 1.1em !important;
	margin: 0 0 10px;
	}
.hariName p,
	.hariName_b p{
	color:#747474;
	font-size: .9em !important;
	}

.hariName dt,
	.hariName_b dt {
	font-size: .9em !important;
	float:left;
	color:#747474;
	}
.hariName dd,
	.hariName_b dd {
	font-size: .9em !important;
	color:#747474;
	}
	
	
.hariName_b {
	background:#f1f1f1;
	padding: 3%;
	border: solid 1px #ccc;
	width:100%;
	margin: 0 0 20px;
	}	
	
/*--------------MC-----------------*/

/*.sub_text_l,
.sub_text_f {
	font-size: 1.2em;
	font-weight: bold;
	margin: 5px 0;
	padding: 5px 10px;
	display: inline-block;
	border: 1px solid #ccc;
	background: #fff;
}

.sub_text_l::before,
.sub_text_f::before {
	content: "";
	display: inline-block;
	width: 12px;
	height: 12px;
	margin: 0 5px 0 0;
	vertical-align: middle;
}
.sub_text_l::before {
	background: #69C;
}
.sub_text_f::before {
	background: #F66;
}*/
	
.plane {
		color: #5fb36d;
		border: 2px solid #5fb36d;
		border-radius: 6px;
		padding: 2px 6px;
		margin: 0 0 0 10px;
		font-size: .9em;
		background: #fff;
	}	
	.pattern {
		color: #fff;
		border: 2px solid #5fb36d;
		border-radius: 6px;
		padding: 2px 6px;
		margin: 0 0 0 10px;
		font-size: .9em;
		background: #5fb36d;
	}		

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

.hariTable{
	border-collapse:collapse;
	width:100%;
	table-layout: fixed;
	overflow: hidden;
	margin: 0 0 40px;
	background: #fff;
	}
.hariTable td {
	border:solid 1px #CCCCCC;
	padding:15px 1% 10px;
	text-align:center;
	font-size: .9em !important;
	word-wrap: break-word;
	color:#5b5b5b;
	vertical-align: top;
	line-height: 1.8 !important;
	}
.hariTable td img:not(.pattern_img) {
	max-width: 100%;
	width: 100px;
	height: auto;
	object-fit: cover;
}
.hariTable td p {
	line-height: 1.8 !important;
}

/*CRES imgサイズ　統一*/

.cres_fab_size .hariTable td img:not(.pattern_img)  {
	width: 100px;
	height: auto;
	object-fit: cover;
	border: 1px solid #ccc;	
	margin: 0 auto;
}

/*---------CRES パターンサンプル-------*/
	
.cres_fab_size .pattern_img {
	width: 100% !important;
	max-width: 200px !important;
	height: auto !important;
	margin: 0 auto;
	display: block;
	padding: 5px 0 0;
	box-shadow: 0px 3px 6px 2px rgba(0, 0, 0, 0.2);
}
	
/*---------CRES パターンサンプル-------*/
.cres_fab_size .hariName .pattern_img {
	width: 100% !important;
	max-width: 200px !important;
	height: auto !important;
	padding: 5px;
}
		
	
/*---------PRO パターンサンプル-------*/
.pattern_img {
	width: 100% !important;
	height: auto !important;
	padding: 5px;
}

.spec_image {
	width: 100% !important;
	max-width: 400px !important;
	height: auto !important;
	}	
	
/*---------adal パターンサンプル-------*/		
	
.pattern_sample {
	width: 100% !important;
	height: auto !important;
	padding: 2%;
	}			

/*---------NAZERO-------*/

.hariTable_nazero {
	border-collapse:collapse;
	width:100%;
	table-layout: fixed;
	overflow: hidden;
	margin: 0 0 40px;
	background: #fff;
	}
.hariTable_nazero td {
	border:solid 1px #CCCCCC;
	padding:15px 1% 10px;
	text-align:center;
	font-size: .9em !important;
	word-wrap: break-word;
	color:#5b5b5b;
	vertical-align: top;
	font-weight: 500;
	}
.hariTable_nazero td img {
	max-width: 100%;
	width: 100px;
	height: auto;
}
	
.hariTable_nazero tr:nth-child(even) td {
	text-align: left;
	/*font-weight: bold;*/
	}

/*---------NAZEROパターンサンプル-------*/

.hariTable_nazero .pattern_img {
	width: 100% ;
	max-width: 220px !important;
	height: auto;
	}

.hariTable_nazero tr:first-child td:first-child {
	vertical-align: middle;
	}
		
	/*---------NAZEROパターンサンプル-------*/

.pattern_img2 {
	width: 100% !important;
	max-width: 220px !important;
	height: auto !important;
	}		

.red_maru {
	display: inline-block;
	width: 8px;
	height: 8px;
	border-radius: 50%;
	background-color: red;
	margin: 0 4px 0 0;
}	
.blue_maru {
	display: inline-block;
	width: 8px;
	height: 8px;
	border-radius: 50%;
	background-color: blue;
	margin: 0 4px 0 0;
}
.rb_maru {
	margin: 0 0 0 10%;
	display: inline-block;
}	

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

.hariji_headtxt {
	margin: 30px 0 20px !important;
	color: #747474;
	background: #f3edd3;
	padding: 10px 20px;
	font-size: 1.1em;
}
.hariji_headtxt2 {
	margin: 30px 0 10px !important;
	color: #747474;
	padding: 0 0 5px;
	font-size: 1.2em;
	border-bottom: solid 1px #5b5b5b;
}

/*------------------アダル・ナゼロ--------------------*/
.hariName {
	position: relative;
}
.fabbrand_logo {
	position: absolute;
	top: 10px;
	right: 10px;
	width: 100%;
	max-width: 80px !important;
	mix-blend-mode: multiply;		
}
@media screen and (max-width: 414px) {
	
.fabbrand_logo {
	position: inherit;
	bottom: 10px;
	left: 0;
	width: 100%;
	max-width: 80px !important;		
}
}

.mobus_logo {
	width: 100%;
	max-width: 436px;
}

/*----カタログサイトリンク---*/	

.footer_catalog_link {
	margin: 20px 0 30px;
	border-radius: 6px;
}
.footer_catalog_link a {
	text-decoration: none;
	color: #5b5b5b;
	display: block;
	background: #f1f1f1;
	padding: 20px;
}
.footer_catalog_link a img {
	width: 200px;
	height: 283px;
	object-fit: cover;
	display: block;
	margin: 0 auto 20px;
	transition: .3s ease-in-out;
	box-shadow: 0 1px 1px rgba(0,0,0,0.12), 
			0 2px 2px rgba(0,0,0,0.12), 
			0 4px 4px rgba(0,0,0,0.12) ;
}
.footer_catalog_link a img:hover {
	opacity: .7;
}
.footer_catalog_link a p {
	text-align: center !important;
	
}
	
	
	/*PC用*/

.catalog_link {
	display: none;
}
/*-------closeボタン-------*/

.c_btn {
	padding: 4px 12px;
}
.c_btn:hover {
	cursor: pointer;
}
#right form {
	text-align: center !important;
	margin: 10px 0 20px;
}

/*---------機能説明--------*/	

.kinoubox,.kinoubox2 {
	display:none;
	}
#oliverkinou{
	display:none;
	}
.kinoubox_sp,.kinoubox2_sp {
	display: inherit;
	width: 100%;
	height: auto;
	margin: 20px 0;
}

/*--------抗ウイルス-------*/

.spec_info,
.spec_info2 {
	margin: 20px 0 30px;
}
.spec_info2  {
	text-align: center;
}

.spec_info2 h3 {
	color: #1352a1;
	font-size: 1.1em;
	margin: 20px 0;
}
.spec_info2 img:nth-of-type(3) {
	padding: 0 40px;
}
.spec_info2 img:nth-of-type(4) {
	padding: 0 40px;
}


.cres_fab_spec p {
		color: #747474;
	}
	
.spec_headding {
	background: #1eb4a9;
	padding: 5px 5px 5px 15px;
	font-size: 1.1em !important;
	color: #f1f1f1;
	margin: 0 0 5px;
}

.virus_midashi {
	border-left: 5px solid #1eb4a9;
	border-bottom: 1px solid #1eb4a9;
	padding: 0 0 0 10px;
	color: #1eb4a9;
	font-size: 1.1em !important;
	margin: 0 0 5px;
	text-align: left;	
}

.spec_info img {
	width: 100%;
	max-width: 100%;
	height: auto;
	display: block;
	margin: 0 auto;
	
}

.virus_midashi + p {
	font-size: 1.0em;
	padding: 5px 0 0;
	margin: 0 0 40px;
	
}
.caution {
	list-style: none;
	line-height: 1.8;
	border: 1px solid #ccc;
	padding: 20px;
	margin: 0 0 30px;
	font-size: .8rem;
	background: #fff;
}

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

.flex_fab {
	display: flex;
	flex-warp: wrap;
}
.flex_fab p  {
	text-align: center !important;
	margin: 0 20px 0 0;	
}
.flex_fab p:last-of-type  {
	margin: 0;	
}
.flex_fab p br {
	display: block;
	height: 0;
}
.flex_fab p a {
	text-decoration: none;
	text-align: center;
}

@media screen and (max-width: 576px) {
	
.flex_fab {
	display: flex;
	flex-direction: column;
	align-items: center;
}
.flex_fab p {
	margin: 0 0 15px;
}
}

/*=======クレス・チェリー・プロ　機能説明=======*/
	
.kinou-tit{
	background:#3333CC;
	color:#FFFFFF;
	padding: 5px 5px 5px 10px;
	font-weight:bold;
	}
.kinou{
	background:#E6EBF0;
	color:#526192;
	padding: 5px;
	font-weight:bold;
	margin-top: 5px;
	font-size: .8rem;
	}
.kinou + dd {
	margin: 5px 0;
	font-size: .8rem;
	text-indent: 1em;
	text-align: justify;
    word-break: break-all;
    text-justify: inter-ideograph;
    text-justify: inter-character;
    word-wrap: break-word;
    overflow-wrap: break-word;
    text-align-last: left;
	}
	
/*============オリバー 機能説明================*/

.kinou-tit2{
	background: #97A888;
	color:#FFFFFF;
	text-align: center;
	padding: 5px 10px;
	font-weight:bold;
	font-size: 15px;
	margin: 10px 0 20px;
	}
.kinoubox2{
	width:152px;
	margin: 20px 0;
	border:solid 1px #CCCCCC;
	padding: 4px 6px 20px;
	clear: both;
	}
	
.kinou2{
	background:#E3FDEF;
	border:solid 1px #6699CC;
	color:#526192;
	padding: 5px 5px 5px 10px;
	font-weight:bold;
	border-radius: 6px;
	}
.kinoubox2_sp p {
	text-align: justify;
	text-justify: inter-ideograph;
	font-size: .9em;
	margin: 5px 0;
}
.kinoubox2_sp p:nth-child(odd) {
	text-align: justify;
	text-justify: inter-ideograph;
	font-size: .9em;
	margin: 5px 0;
}
.sample_img {
	max-width: 180px !important;
	width: 100% !important;
	height: auto !important;
	}
	

/*-------張地ページ　お問い合わせ-------------*/

.hari_contact_wrap {
	background: #f1f1f1;
	padding: 30px;
	margin: 20px 0;
	border-radius: 6px;
}
.hari_contact {
	display: flex;
	justify-content: space-around;
	align-items: center;
	
}
.hari_contact_item {
	display: flex;
	flex-direction: column;
	align-items: center;
	margin: 0 10px 0 0;
}

.hari_contact_item:nth-of-type(2) {
	margin: 0;
}

.hari_contact_item p {
	font-weight: bold;
}


@media screen and (max-width: 576px) {

.hari_contact {
	display: flex;
	flex-direction: column;
	align-items: center;
	
}

.hari_contact_item {
	margin: 0;
}

.hari_form_button2 {
	width: 280px !important;
}
.hari_tel_button {
	width: 280px !important;
}

}

.hari_form_button2:hover {
	opacity: 0.8;
	color: #FFF !important;
	box-shadow: 1px 1px inset #3C0;
	
}
.hari_form_button2:activ {
	box-shadow: 2px 2px inset #3C0;
}
.hari_form_button2 {
	padding: 15px 18px;
	display: block;
	border-radius: 6px;
	border: 2px #FFF solid;
	box-shadow:0 0 1px 1px #B2B2B2;
	margin: 10px auto 16px;
	color: #FFF !important;
	text-shadow: 1px 1px #333;
	text-align: center;
	text-decoration: none;
	width: 100%;
	max-width: 260px;
	font-size: 1.0em;
	font-weight: bold;
	transition: .3s ease-in-out;
	
	background: -webkit-gradient(linear, left top, left bottom, color-stop(0.00, #42ff39), color-stop(1.00, #00a12d));
	background: -webkit-linear-gradient(#42ff39, #00a12d);
	background: -moz-linear-gradient(#42ff39, #00a12d);
	background: -o-linear-gradient(#42ff39, #00a12d);
	background: -ms-linear-gradient(#42ff39, #00a12d);
	background: linear-gradient(#42ff39, #00a12d);
	
}

.hari_tel_button {
	border: 1px solid #7f9a7f;
	box-shadow: 0 1px 1px #CCC;
	border-radius: 6px;
	background: #FFF;
	width: 100%;
	max-width: 260px;
	box-sizing: border-box;
	text-align: center !important;	
	margin: 10px auto 15px !important;
	font-size: .8em !important;
}


_:lang(x)+_:-webkit-full-screen-document, .hari_tel_button {
  	width: 100%;
	max-width: 280px;
}

.hari_tel_button a {
	display: block;
	padding: 4px 12px;
	/*height: 56px;*/
}
.hari_tel_button a:activ {
	border: 1px solid #cd2a2b;
	box-shadow: none;
	
}
.hari_contact_svg {
	width: 30px !important;
	vertical-align: central;
}
.hari_tel_button:last-of-type .contact_svg {
	width: 30px;
	vertical-align: central;
	margin: 0 0 -3px;
}
.hari_dial_button {
	margin: 0 0 0 4px;
	line-height: 1.1;
	display: inline-block;
	padding: 4px 0;
	text-align: left;
}
.hari_dial_txt {
	font-size: 0.75em;
	color: #cd2a2b;
	padding: 0;
}
.hari_dial_txt_tel {
	font-size: 0.75em;
	color: #cd2a2b;
}
.hari_contact_tel {
	font-size: 1.7em;
	color: #cd2a2b;
	font-weight: bold;
}

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

.mark_img {
	max-width: 140px !important;
	margin: 10px 0;
}

/*--------------------------------------*/
	
.bousai_mark {
	width: 200px !important;
}

/*-----モバイルページトップへ-------*/

.pagetop {
    display: none;
    position: fixed;
    bottom: 3%;
    right: 3%;
	z-index: 100;
}
.pagetop a {
    display: block;
    background-color: #3bbd00;
    text-align: center;
    color: #f7f7f7;
    font-size: 12px;
	text-shadow: 1px 1px 1px rgba(0,0,0,.4);
    text-decoration: none;
    padding: 10px 16px;
    opacity: .9;
	border-radius: 6px;
	transition: .3s ease-in-out;
	box-shadow: 0 1px 1px rgba(0,0,0,0.12), 
			0 2px 2px rgba(0,0,0,0.12), 
			0 4px 4px rgba(0,0,0,0.12);
}
.pagetop a:hover {
    display: block;
    background-color: #6ef468;
    text-align: center;
    color: #f7f7f7;
    font-size: 12px;
	text-shadow: 1px 1px 1px rgba(0,0,0,.8);
    text-decoration: none;
    padding:10px 16px;
    opacity: .7;
	border-radius: 6px;
}


/*--------------張地トップページボタン-----------*/

.top_link {
	margin: 40px 0 0;
	height: 80px;
	min-width: 320px;
}

.top_link a {
	display: block;
	width: 280px;
	text-align: center;
	text-decoration: none;
	margin: 0 auto;
	font-size: 1.1em;
	font-weight: bold;
    /*background: #f3edd3;*/
    background: #f7e493;
    padding: 15px;
	color: #5b5b5b;
    border-radius: 6px;
    transition: all .1s ease-in-out;
    border-top: 1px solid #D9D8BD;
    border-right: 1px solid #D9D8BD;
    border-left: 1px solid #D9D8BD;
    border-bottom: 4px solid #D9D8BD;
	box-shadow: 0 0 2px #D9D8BD;
}

.top_link a:hover {
	color: #247227 !important;
    border-top: 4px solid #D9D8BD;
    border-right: 1px solid #D9D8BD;
    border-left: 1px solid #D9D8BD;
    border-bottom: 1px solid #D9D8BD;
	box-shadow: 0 0 0 #D9D8BD;
}

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

.leather_link {
	background: #f1f1f1;
	border-radius: 6px;
	margin: 0 0 50px;
	padding: 20px;
}
.leather_link p {
	text-align: center !important;
	font-size: 1.0em !important;
	margin: 0 0 5px;
}
.leather_link p a img {
	width: 300px;
}
.leather_link p a {
	transition: .3s ease-in-out;
}
.leather_link p a:hover {
	opacity: .7;
}

.leather_txt {
	font-size: 1.15em;
	margin: 10px 0;
}
.opa {
	transition: .3s ease-in-out;
}
.opa:hover {
	opacity: .7;
}

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

.link_area {
	display: flex;
	justify-content: space-between;
	flex-wrap: nowrap;
	padding: 0 3% 30px;
	margin: -8px 0 30px;
	background: #f5f2e9;
}
	
	@media screen and (max-width: 578px) { 
	
.link_button {
	font-size: .9em !important;
}
		
}

	
	.link_area p {
		width: 31%;
		
	}
.link_button {
	/*background: #3bbd00;*/
	background: #e6931d;
	color: #f7f7f7; 
	box-sizing: border-box;
	font-size: 1.0em;
	font-weight: bold;
	padding: 5px 0;
	display: block;
	height: 100%;
	text-decoration: none;
	text-align: center !important;
	border-radius: 6px;
	box-shadow: 1px 1px 2px #ccc;
	transition: .3s ease-in-out;
}

.link_button:hover {
	opacity: .7;
}


/*-------機能説明　ふきだし--------------*/


.fab_spec_wrap {
  position: relative;
  margin: 15px 0 0;
  text-align: left;
}
.fab_spec {
	line-height: 2.6;
	margin: 0 8px 8px 0;
	word-break: keep-all;
	cursor: pointer;
	transition: .3s ease-in-out;
	padding:2px 6px;
	background:#E3FDEF;
	color: #5b5b5b;
	border:solid 1px #6699CC;
	font-size: 1.0em;
	border-radius: 6px;
	
}

.spec {
  position: absolute;
  top: 100%;
  left: 50%;
  transform: translateX(-50%);
  width: 75%;
  padding: 16px;
  margin: 8px 0 0 0;
  border-radius: 6px;
  background: #333;
  color: #fff;
  font-size: 1.0em;
  z-index: 10000;
  opacity: 0;
  
  
}

.fab_spec:hover + .spec {
  animation: fadeIn .6s ease-out .3s 1 forwards;
}

.fab_spec:hover {
	background: #e1f1f0;
}


/*-----------------フォームボタン----------------------*/

.fab_contact {
	background: #f3edd3;
	padding: 20px;
	margin: 20px 0;
	border-radius: 6px;
	text-align: center;
	width: 100%;
	min-width: 320px;
}
.fab_contact_text {
	font-size: 1.0em !important;
	font-weight: bold;
	display: inline;
}
.fab_form_button {
	padding: 13px 15px 13px;
	display: block;
	border-radius: 6px;
	border: 2px #FFF solid;
	box-shadow: 0 0 1px 1px #B2B2B2;
	margin: 10px auto 15px;
	color: #FFF !important;
	text-shadow: 1px 1px #333;
	text-align: center;
	text-decoration: none;
	width: 280px;
	font-size: 1.0em;
	font-weight: bold;
	/*transition: .3s ease-in-out;*/
	
	background: -webkit-gradient(linear, left top, left bottom, color-stop(0.00, #42ff39), color-stop(1.00, #00a12d));
	background: -webkit-linear-gradient(#42ff39, #00a12d);
	background: -moz-linear-gradient(#42ff39, #00a12d);
	background: -o-linear-gradient(#42ff39, #00a12d);
	background: -ms-linear-gradient(#42ff39, #00a12d);
	background: linear-gradient(#42ff39, #00a12d);
	
}

.fab_form_button:activ {
	box-shadow: 2px 2px inset #3C0;
}

.fab_form_button:hover {
	color: #fff !important;
  	background: #52cc46;
	box-shadow: 0 0 1px 1px inset #3C0;
	
}

/*------------アドバイスマン---------------------------*/

.advice {
	color: #247227 !important;
	margin: 10px 0;
}
.advice::before {
	content: '';
	display: inline-block;
	width: 16px;
	height: 20px;
	background-image: url(../planning/img/advice_man.svg);
	background-size: contain;
	background-repeat: no-repeat;
	vertical-align: middle;
	margin: 0 5px 0 0;
}

/*------------フーガSP　Aランク張地 別ウインドウ-------------------*/

.fab_window_wrap {
	width: 100%;
	background: #f3edd3;
	padding: 0;
}

.fab_window {
	background: #fff;
}
.fab_window h1 {
	text-align: center;
	margin-top: 0 !important;
}

}

/*モバイルCSS END*/



@keyframes fadeIn { /*張地機能説明*/

  0% {opacity: 0} /*アニメーション開始時は不透明度0%*/

  100% {opacity: .9} /*アニメーション終了時は不透明度90%*/

}