@charset "utf-8";
body{
	font-family: 游ゴシック体, 'Yu Gothic', YuGothic, 'ヒラギノ角ゴシック Pro', 'Hiragino Kaku Gothic Pro', メイリオ, Meiryo, Osaka, 'ＭＳ Ｐゴシック', 'MS PGothic', sans-serif;
	line-height:1.5;
	font-size:15px;
	font-weight:500;
	color:#626262
}
a {
	color:#626262;
	text-decoration:none;
}
a:hover {
	opacity:0.6;
}
a.topArw{
	position:fixed;
	bottom:30px;
	right:30px;
}
@media screen and (min-width:768px) {
  .spOnly{display:none !important;}
  .pcOnly{display:block;}
}
/* スライダー ****************************************************/
.slider{
	margin:auto;

}
.slcPrevArw,.slcNextArw{
	display: block;
	width: 35px;
	height: 35px;
	border: solid 4px #606060;
	border-radius: 50px;
	position:absolute;
	z-index: 9;
	left:0;
	right: 0;
	margin: auto;
	top:50%;
	cursor:pointer;
}
.slcPrevArw:hover,.slcNextArw:hover{
	opacity:.7;
}
.slcPrevArw{
	right:1000px;
}
.slcNextArw{
	left:1000px;
}
.slcPrevArw:after,.slcNextArw:after{
	content:"";
	width:15px;
	height:15px;
	border-left:solid 4px #606060;
	border-bottom:solid 4px #606060;
	display: block;
	position: relative;
	top: 6px;
}

.slcPrevArw:after{
	transform: rotate(45deg);
	left: 7px;
}
.slcNextArw:after{
	transform: rotate(-135deg);
	left: 5px;
}
.slick-dots{
	bottom:30px;
}
.slick-dots li{
	margin: 0 12px;
}
.slick-dots li button:before{
	font-size:14px;
}
.slick-dotted.slick-slider{
	margin-bottom:0;
}
/* ヘッダー ****************************************************/
header{
	background-color:#d6d6d6;
	width:100%;
	min-width:1170px;

}
.hdInnner{
	width:1170px;
	margin:auto;
	padding:20px 30px 30px;
	position:relative;
}
.hdInnner h1{
	float:left
}
.hdInnner nav.spNav{
	display:none;
}
.hdInnner nav.pcNav{
	float:right;
	position: absolute;
	bottom: 20px;
	right: 30px;
}
.hdInnner .gNav01,.hdInnner .gNav02{
	display:inline-block;
	font-size:0px;
}
.hdInnner .gNav01 li{
	display:inline-block;
	vertical-align: middle;
	font-size:14px;
	margin-right:5px;
	margin-left:15px;
	font-weight:bold;
}
.hdInnner .gNav02 li{
	display:inline-block;
	vertical-align: middle;
	margin-left:15px;
}
/* メインカラム ****************************************************/
main{
/*
	width:900px;
*/
}
.mainInner{
	background-color:#d6d6d6;
	min-width:1170px;
}

.mainInner nav{
	background-color:#e7e7e7;
	padding:20px 0;
}
.mainInner nav ul{
	width: 900px;
	margin: auto;
	height: 41px;
	text-align: justify;
	text-justify: distribute-all-lines; 
}
.mainInner nav ul:after{
	content:"";
	display: inline-block;
	width: 100%;
	line-height:0;
	height: 0;
}
.mainInner nav li{
	display:inline-block;
	font-weight:bold;
	font-size: 14px;
}
.mainInner nav li a{
	padding:10px 0;
	width:100%;
	display:block;
}

.mainInner .mainBnrBlock01{
	width: 900px;
	margin:auto;
}
.mainInner .mainBnrBlock01 li{
	float:left;
}
.mainInner .mainBnrBlock01 li:last-child{
	width:300px;
	overflow:hidden;

}

.newsArea{
	width:100%;
	min-width:1170px;
	background-color:#e7e7e7;
}
.newsArea .newsInnner{
	width:900px;
	margin:auto;
	padding:50px 0px 50px 25px;
}
.newsInnner h2{
	width:200px;
	height:200px;
	border:solid 1px #c8c8c8;
	padding-top:75px;
	font-size:30px;
	letter-spacing:3px;
	font-weight:500;
	color:#666666;

}
.newsInnner>*{
	float:left;
}
.newsInnner ul{
	margin-left:25px;
	width:650px;
	text-align:left;
}
.newsInnner li{
	border-bottom:solid 1px #c8c8c8;
}
.newsInnner li:first-child{
	border-top:solid 1px #c8c8c8;
}
.newsInnner li p{
	display:inline-block;
	font-weight:bold;
	margin-left:15px;
	margin-right:10px;
	line-height: 49px;
	letter-spacing:1px;
}
.newsInnner li .pcOnly{
	font-size: 12px;
}
.newsInnner li p:last-child:after{
	content:"";
	border-left:5px solid #000;
	border-top:5px solid transparent;
	border-bottom:5px solid transparent;
	display:inline-block;
	margin-left:2px;
}
.aboutKokl{
	width:100%;
	background-image:url(../images/bg_01.png);
	background-size: cover;
	background-repeat: no-repeat;

}
.aKInner{
	width:900px;
	margin:auto;
	color:#fff;
	padding:20px 0 20px 0;
}
.aKInner>*{
	float:left;

}
.aKInner>img{
	margin-top:110px;
}
.aKInner>div{
	width:675px;
	box-sizing:border-box;
	padding:40px 0px 20px 135px;
	text-align:left;
	line-height:20px;

}
.aKInner>div>h2{
	margin-bottom:15px;
	font-size: 24px;
	line-height: 130%;
	font-weight: bold;
}
.aKInner>div>a{
	padding:7px 15px;
	background-color:rgba(230,230,230,0.4);
	letter-spacing:2px;
	margin-top:20px;
	display:block;
	width:160px;
	font-size: 18px;
	letter-spacing: 1px;
}

.aKInner>div>a:hover{
	opacity:0.7;
}

.aKInner>div>a:after{
	content:"";
	border-left:7px solid #626262;
	border-top:7px solid transparent;
	border-bottom:7px solid transparent;
	display:inline-block;
	margin-left:4px;
}
.mainBnrBlock02{
	font-size:0;
	width:900px;
	margin:70px auto;
}
.mainBnrBlock02 li{
	display:inline-block;
}
.blogArea{
	background-color:#e7e7e7;
	padding-top:50px;
	padding-bottom:20px;
}
.company-toph2{
	font-size: 24px !important;
	line-height: 130%;
	font-weight: bold;
	color: #68bdc8;
	text-align: left;
	margin: 30px 0
}
.blogArea h2{
	font-size:30px;
	letter-spacing:3px;
	font-weight:500;
	color:#666666;
	margin-bottom:50px;
}
.other{
	font-size: 18px !important;
	margin-bottom: 20px;
	display: inline-block;
	float: left;
}
.p_btn_txt{
	font-size: 16px !important;
	line-height: 150% !important;
	text-align: left;
	padding-top: 15px;
}
.blogArea>div{
	width:900px;
	margin:auto;
	font-size:0;
}
.blogArea ul{
	display:flex;
	margin-bottom:40px;
}
.blogArea li{
	width:225px;
	font-size:12px;
	background-color:#fff;
	position: relative;
}
.blogArea li:nth-of-type(3){
	background-color:#f4f4f4;
}
.blogArea li p{
	padding:0 15px;
	font-size:10px;
	text-align:left;
}
.blogArea li p:nth-of-type(1){
	color:#009aac;
	font-size:14px;
	height:60px;
	vertical-align: middle;
	display: table-cell;
	font-weight: bold;
}
.blogArea li p:nth-of-type(2){
	font-size: 12px;
}
.blogArea li p:nth-of-type(3){
	float:left;
	font-weight:900;
	position: absolute;
	bottom: 5px;
}
.blogArea li p:nth-of-type(3):after{
	content:"";
	border-left:5px solid #000;
	border-top:5px solid transparent;
	border-bottom:5px solid transparent;
	display:inline-block;
	margin-left:2px;
}
.blogArea li p:nth-of-type(4){
	float:right;
	position: absolute;
	bottom: 5px;
	right:0;
}
.partNews .image div img{
		height:150px;
		width:100%;
		overflow:hidden;
	object-fit: cover;
}
.newsDate {
    	font-size:12px;
}
.cateLabel {
    	margin-top:15px;
    	width:10%;
}
/* フッター ****************************************************/
footer{
	background-color:#dfdfdf;
	padding-top:60px;
	padding-bottom:60px;
	min-width:1170px;
}
footer .ftInnner{
	width:900px;
	margin:auto;
	text-align:left;
	position:relative;
}
.ftInnner .ftNav{
	float:left;
}
.ftInnner .ftNav ul{
	margin-bottom:30px;
	margin-top:5px;
	margin-right:20px;
}
.ftInnner .ftNav li{
	margin-bottom:5px;
	margin-left:10px;
}
.ftInnner .ftNav li:before{
	content:"";
	width:8px;
	height:8px;
	display:inline-block;
	border-bottom:1px #000 solid;
	border-left:1px #000 solid;
	margin-right:5px;
}
.ftInnner h2{
	font-size:16px;
}
.ftInnner li{
	font-size:14px;
}
.ftInnner .ftLogoArea{
	float: right;
	position: absolute;
	bottom: 0;
	right: 0;
	text-align:right;
}
.ftLogoArea .logo{
	margin-bottom:10px;
	width:200px;
	height:auto;
}
@media screen and (min-width:768px) {
	.pc-none{
		display: none;
	}
}

/*********************************************************
for SP
*********************************************************/
@media screen and (max-width:767px) {
	.spOnly{display:block;}
	.pcOnly{display:none !important;}
	.company-toph2{
		font-size: 12px !important;
		margin: 20px 0;
		text-align: center;
	}
	.other{
		font-size: 12px !important;
		padding-top: 15px;
	}
	.p_btn_txt{
		font-size: 10px !important;
	}

	/* スライダー ****************************************************/
	.slider{
		width: 100%;
	}
	.slider img{
		width: 100%;
	}
	.slcPrevArw,.slcNextArw{
	}
	.slcPrevArw:hover,.slcNextArw:hover{
	}
	.slcPrevArw{
		right: 90%;
	}
	.slcNextArw{
		left: 90%;
	}
	.slcPrevArw:after,.slcNextArw:after{
	}

	.slcPrevArw:after{
	}
	.slcNextArw:after{
	}
	.slick-dots{
	}
	.slick-dots li{
	}
	.slick-dots li button:before{
	}
	.slick-dotted.slick-slider{
	}
	/* ヘッダー ****************************************************/
	header{
		min-width:auto;
	}
	.hdInnner{
		width:100%;
		padding:2px 20px 9px 20px;
	}
	.hdInnner h1{
		width: 120px;
		margin: auto;
		display: block;
		float:none;
	}
	.hdInnner h1 img{
		width:100%;
    vertical-align: middle !important;
	}
	.hdInnner nav.pcNav{
		display:none;
	}
	.hdInnner nav.spNav{
		display:block;
	}

	.hdInnner .gNav01,.hdInnner .gNav02{
	}
	.hdInnner .gNav01 li{
	}
	.hdInnner .gNav02 li{
	}
	/* メインカラム ****************************************************/
	main{
	}
	.mainInner{
		min-width: auto;
	}

	.mainInner nav{
		display:none;
	}
	.mainInner nav ul{
	}
	.mainInner nav li{
	}
	.mainInner nav li:last-child{
	}
	.mainInner nav li a{
	}

	.mainInner .mainBnrBlock01{
		padding-left:40px;
		padding-right:40px;
		margin-top:30px;
		margin-bottom:30px;
		width: 100%;
	}
	.mainInner .mainBnrBlock01 li{
		width: 50%;
	}
	.mainInner .mainBnrBlock01 li:nth-last-of-type(-n+2){
		width: 100%;
	}
	.mainInner .mainBnrBlock01 li img{
		width:100%;
	}
	.newsArea{
		min-width:auto;
	}
	.newsArea .newsInnner{
		width:100%;
		padding:20px;
	}
	.partNews p:nth-child(2){
		font-size: 10px;
	}
	.partNews .image div{
			height:25vw;
			width:25vw;
			overflow:hidden;
	}
	.partNews .image div img{
		height:100%;
		width:100%;
		overflow:hidden;
	object-fit: cover;
}
	.newsInnner h2{
		display: inline-block;
		font-size: 16px;
		width: auto;
		height: auto;
		padding: 0;
		border: none;
		text-align:center;
		width: 100%;
		margin-bottom: 15px;
	}
	.newsInnner>*{
		float:none;
	}
	.newsInnner ul{
		width:100%;
		margin:0;
	}
	.newsInnner li{
	}
	.newsInnner li p:first-child{
		font-size: 8px;
	}
	.newsInnner li p{
		line-height: 34px;
		font-size: 10px;
		letter-spacing: 0px;
		margin-left: 0;
		margin-right: 0;
	}
	.newsInnner li p:last-child:after{
	}
	.cateLabel{
		margin-top: 12px;
		font-size: 9px;
	}
	.aboutKokl{
		height:auto;
	}
	.aKInner{
		width:100%;
		padding: 0
	}
	.aKInner>*{

	}
	.aKInner>img{
		display:none;
	}
	.aKInner>div{
		padding:20px;
		width: 100%;
	}
	.aKInner>div>h2{
		margin: 0 0 15px;
		font-size: 16px;
		line-height: 150%;
		font-weight: bold;
	}
	.aKInner>div>p{
		font-size: 14px;
	}
	.b-top-txt{
		font-size: 10px;
		line-height: 140%;
	}
	.aKInner>div>a{
		padding:10px 10px;
		font-size: 14px;
		width: 130px !important;
		margin-top: 10px;
	}
	.aKInner>div>a:hover{
	}

	.aKInner>div>a:after{
		border-left:5.5px solid #626262;
		border-top:5.5px solid transparent;
		border-bottom:5.5px solid transparent;
	}
	.mainBnrBlock02{
		padding:20px 30px;
		width:100%;
		margin:0;
	}
	.mainBnrBlock02 li{
		width: 50%;
	}
	.mainBnrBlock02 li img{
		width:100%;
	}
	.blogArea{
		padding-top: 0;
		padding-bottom: 20px;
	}

	.blogArea h2{
		margin-bottom: 20px;
		font-size:16px;
	}

	.blogArea>div{
		width:100%;
		padding:20px 30px;
	}
	.blogArea ul{
		display:block;
		margin-bottom:30px;
	}
	.blogArea li{
		width: 100%;
		padding:0px;
	}
	.blogArea li div{
		width:30%;
		overflow:hidden;
	}
	.blogArea li div img{
		width:150%;
		float:left;
		object-fit: contain;
		position:relative;
		left:0%;

	}
	.blogArea li>a:after{
		content:"";
		display:block;
		clear:both;
	}
	.blogArea li:nth-of-type(1){
		margin-bottom:10px;
		padding:0;
	}
	.blogArea li:nth-of-type(1) img{
		width:100%;
		float:none;
	}
	.blogArea li:nth-of-type(3){
	}
	.blogArea li p{
		float:left;
		position:absolute;
		padding: 0;
		left: 35%;
	}
	.blogArea li p:nth-of-type(1){
		height:auto;
		width:60%;
		top: 25px;
		line-height: 20px;
	}
	.blogArea li p:nth-of-type(2){
		width:60%;
		top: 90px;
	}

	.blogArea li p:nth-of-type(3){
		bottom:5px;
		right: 2%;
		left:auto;
	}
	.blogArea li p:nth-of-type(3):after{
	}
	.blogArea li p:nth-of-type(4){
		top: 8px;
	}
	/* フッター ****************************************************/
	footer{
		min-width:auto;
		padding-top: 10px;
		padding-bottom: 30px;
	}
	footer .ftInnner{
		width:100%;
		padding:90px 20px 30px;
	}
	.ftInnner .ftNav{
		float:none;
	}
	.ftNav h2{
		margin-bottom:20px;
	}
	.ftNav ul{
		display:none;
	}
	.ftInnner .ftNav ul{
	}
	.ftInnner .ftNav li{
	}
	.ftInnner .ftNav li:before{
	}
	.ftInnner h2{
	}
	.ftInnner .ftLogoArea{
		right:30px;
	}
	.ftLogoArea .logo{
		width: 130px;
	}
	.ftLogoArea p{
		font-size: 8px;
	}

}



/*ハンバーガー ------------------------------------- */
.dwBtn{
	position: absolute;
	width:13vw;
	height: 11vw;
	display:block;
	cursor: pointer;
	z-index:901;
	right:0;
	top:8px;
}

.dwOuter{
	display: none;
	background-color:#fff;
	position: fixed;
	width:100%;
	z-index: 999;
	text-align:justify;
	font-size:20px;
	overflow:auto;
	padding-bottom:30px;
	margin-bottom:70px;
	left:0;
	top: 50px;
}

ul.dwInner{

}

.dwInner li {
	line-height: 24px;
	border-bottom: dotted 1px #acacac;
}
.dwInner li{
	position:relative;
}
.dwInner li a{
	position:relative;
}
.dwInner li a:after{
	content:"";
	position:absolute;
	border-left:5px solid #000;
	border-top:5px solid transparent;
	border-bottom:5px solid transparent;
	display:inline-block;
	margin-left:2px;
	top:19px;
	right:20px;
}
.dwInner li a {
	color:#000;
	display: block;
	padding: 11px;
	font-size: 18px;
	text-decoration:none;
	line-height:24px;
}
.dwInner li ul li{
	line-height: 16px;
	padding-left:30px;
}
.dwInner li ul li a{
	color:#000;
}
.dwBtn div{
	width:8vw;
	height:1.3vw;
	background-color:#000;
	position:absolute;
}


.menuBdr1{
	top:4px;
}
.menuBdr2{
	top:14px;
}
.menuBdr3{
	top:24px;
}
.menuTxt{
	position:absolute;
	top:4.5vw;
	font-size: 2.2vw;
	color: #000;
}
.menuBdr1,.menuBdr2,.menuBdr3{
	transition: all 0.2s ease-out;
	-o-transition: all 0.2s ease-out; /* Opera */
	-moz-transition: all 0.2s ease-out; /* Firefox */
	-webkit-transition: all 0.2s ease-out; /* GoogleChrome, Safari */
	-ms-transition: all 0.2s ease-out; /* IE */
}

.menuBdr1Clk{
	top:10px;
	-o-transform: rotate(30deg);
	-moz-transform: rotate(30deg);
	-webkit-transform: rotate(30deg);
	-ms-transform: rotate(30deg);
	transform: rotate(30deg);

}
.menuBdr2Clk{
	opacity:0;
}
.menuBdr3Clk{
	top:10px;
	-o-transform: rotate(-30deg);
	-moz-transform: rotate(-30deg);
	-webkit-transform: rotate(-30deg);
	-ms-transform: rotate(-30deg);
	transform: rotate(-30deg);
}
/* ------------------------------------- ハンバーガー*/