@charset "utf-8";

/* 大枠 */
html,
body {
	height: 100%;
	}
body {
	font-size: 14px; 
	line-height:1.6;
	}
#wrapper {
	width: 100%;
	min-width: 960px;
	margin: 0 auto;
	position: relative;
	}
body > #wrapper {
	height: auto;
	}
.clearfix:after {
    visibility: hidden;
    display: block;
    content: " ";
    clear: both;
    height: 0;
    }
	
/* リンク */
a:link    {color:#333333; text-decoration: none;}
a:visited {color:#333333; text-decoration: none;}
a:hover   {color:#333333; text-decoration: underline;}
a:active  {color:#333333; text-decoration: underline;}

/* アクセシビリティ */
.guidance {
	left:-999px;
	position:absolute;
	width:990px;
	}
img {
	vertical-align: bottom;
	}

#main p.alCenter {
	text-align: center;
	margin: 1em 0;
}
#main p.alR {
	text-align: right !important;
	margin: 1em 0;
}
#main p.alL {
	text-align: left;
	margin: 1em 0;
}

/* ▼▼▼ ヘッダー
=====================================*/

#header {
    width: 100%;
    border-top: 10px solid #000;
    border-bottom: 1px solid #ccc;
}

#header-inner {
    width: 960px;
    margin: 0 auto;
    position: relative;
    height: 125px;
    position: relative;
    bottom: -1px;
}

#header-right {
    position: absolute;
    right: 0;
    top: 20px;
}

#header-contact {
    position: absolute;
    bottom: 10px;
    right: 0;
}
#header-contact img {
width: 144px;
}

.header-text {
    display: inline-block;
    padding-top: 20px;
    font-size: 13px;
    line-height: 1.3;
    color: #111;
}

#main-menu {
    position: absolute;
    bottom: 0;
    left: 0;
}

#main-menu li {
    float: left;
    border-bottom: 4px solid #ccc;
    width: 98px;
    height: 40px;
    text-align: center;
    background-position: 50% 50%;
    background-repeat: no-repeat;
}

#main-menu li a {
    display: block;
    width: 100%;
    height: 100%;
}

#main-menu li:hover,
#main-menu li.now {
    border-bottom: 4px solid #e50012;
}

#sub-menu {
    float: left;
    margin-right: 20px;
}

#sub-menu li {
    font-size: 13px;
    margin-left: 15px;
    float: left;
}


#sub-menu a {
    padding-left: 17px;
    background: url(../img/head_arrow_off.png) 0 50% no-repeat;
    background-size: 13px 13px;
}

#sub-menu a:hover {
    background: url(../img/head_arrow_on.png) 0 50% no-repeat;
    background-size: 13px 13px;
}

#logo {
    display: inline-lock;
    margin: 10px 15px 0 0;
    float: left;
}

#logo img {
    width: 98px;
    height: auto;
}

#main-menu .whatis {
    background-image: url(../img/head_menu_1_off.png);
}

#main-menu .whatis:hover,
#main-menu .whatis.now {
    background-image: url(../img/head_menu_1_on.png);
}

#main-menu .service {
    background-image: url(../img/head_menu_2_off.png);
}

#main-menu .service:hover,
#main-menu .service.now {
    background-image: url(../img/head_menu_2_on.png);
}

#main-menu .works {
    background-image: url(../img/head_menu_3_off.png);
}

#main-menu .works:hover,
#main-menu .works.now {
    background-image: url(../img/head_menu_3_on.png);
}

#main-menu .special {
    background-image: url(../img/head_menu_8_off.png);
}

#main-menu .special:hover,
#main-menu .special.now {
    background-image: url(../img/head_menu_8_on.png);
}


#main-menu .company {
    background-image: url(../img/head_menu_4_off.png);
}

#main-menu .company:hover,
#main-menu .company.now {
    background-image: url(../img/head_menu_4_on.png);
}

#main-menu .recruit {
    background-image: url(../img/head_menu_5_off.png);
}

#main-menu .recruit:hover,
#main-menu .recruit.now {
    background-image: url(../img/head_menu_5_on.png);
}

#main-menu .people {
    background-image: url(../img/head_menu_6_off.png);
}

#main-menu .people:hover,
#main-menu .people.now {
    background-image: url(../img/head_menu_6_on.png);
}

#main-menu .blog {
    background-image: url(../img/head_menu_7_off.png);
}

#main-menu .blog:hover,
#main-menu .blog.now {
    background-image: url(../img/head_menu_7_on.png);
}

/* タイトル */
#site_title {
	float: left;
	overflow: hidden;
	}
h1.title {
	margin-bottom: 15px;
	text-align: center;
	}	
h2.subtitle {
	border-left: 3px solid #E60012;
	padding-left: 10px;
	margin-bottom: 20px;
	font-size: 18px;
	font-weight: bold;
	line-height: 1.2;
	clear: both;
	overflow: hidden;
	}
	


/* ▼▼▼ メイン 「コンテンツとサイドを囲む要素」
=====================================*/
#main {
	width: 100%;
	background: url(../img/bg.gif) repeat left top;
	padding-bottom: 60px;
	clear: both;
	}
	#home #main {padding: 0;}
	.inner {
		width: 960px;
		margin: 0 auto;
		position: relative;
		clear: both;
		}
		
			
/* 赤背景（WORKS） */
#bg_red {
	background: url(../img/bg_red.gif) repeat;
	padding: 50px 0;
	overflow: hidden;
	}
	.side_bg {
		background: url(../img/bg_side.png) repeat-y left top;
		overflow: hidden;
		}
/* 白背景（SERVICE） */
.bg_wh {
	background: #fff;
	padding: 15px 0 30px;
	margin-top: 30px;
	clear: both;
	overflow: hidden;
	}


/* パンくず */
ol#path {
	width: 960px;
	margin: 0 auto 20px;
	padding-top: 10px;
	overflow: hidden;
	}
	ol#path li {
		float: left;
		background: url(../img/path.png) no-repeat right center;
		padding-right: 16px;
		margin-right: 8px;
		color: #999;
		font-size: 11px;
		}
	ol#path li:last-child {
		background: none;
		margin: 0;
		}
		ol#path li a {color: #999;}

/* コンテンツタイトル */

p.lead {
    text-align: center;
    margin: 0 auto 15px;
}

/* コンテンツ白背景 */
.container {
	width: 900px;
	background: #fff;
	padding: 50px 30px;
	clear: both;
	overflow: hidden;
	font-size:114.3%;
	}
.container:after {
    visibility: hidden;
    display: block;
    content: " ";
    clear: both;
    height: 0;
    }
	/* コンテンツ */
	#contents {
		float: right;
		width: 630px;
		position: relative;
		overflow: hidden;
		}
	/* サイド */
	#side {
		float: left;
		width: 218px;
		background: #fff;
		border: 1px solid #CCCCCC;
		border-bottom: none;
		overflow: hidden;
		font-size: 87.5%;
		}
		ul#snav {
			border-top: 1px solid #ccc;
			overflow: hidden;
			}
			ul#snav > li {
				border-bottom: 1px solid #ccc;
				font-weight: bold;
				line-height: 1.2;
				}
				ul#snav > li a {
					display: block;
					padding: 10px;
					}
				ul#snav > li a:hover {
					background: #efefef;
					color: #E50012;
					text-decoration: none;
					}
			ul#snav li.now {
				background: url(../img/now.png) no-repeat left 7px;
				color: #E50012;
				}
				ul#snav li.now span {
					display: block;
					padding: 10px 0 10px 10px;
					}
				ul#snav li.now > a {
					padding: 0;
					color: #E50012;
					}
				ul#snav li.now > a:hover {
					background: url(../img/now.png) no-repeat left 7px;
					}
				/* 2階層目 */
				ul#snav ul.sub li.now {
					background: url(../img/now.png) no-repeat left 3px;
					padding: 6px 0 6px 0;
					}
				ul#snav ul.sub li.no {
					background: none;
					padding: 0;
					}
					ul#snav ul.sub li span {padding: 0;}
					ul#snav ul.sub li.now span {
						background: url(../img/plus_side02.png) no-repeat 20px center;
						padding: 0 0 0 35px;
						}
						ul#snav ul.sub li a {
							background: url(../img/plus_side01.png) no-repeat 20px 9px;
							padding: 6px 0 6px 35px;
							}
						ul#snav ul.sub li.now a {
							color: #E50012;
							background: none;
							}
						ul#snav ul.sub li.no a {
							padding: 6px 0 6px 0;
							}
						ul#snav ul.sub li a:hover {
							background: #efefef url(../img/plus_side02.png) no-repeat 20px 9px;
							}
						ul#snav ul.sub li.no a:hover {
							background: none;
							}
/* ボトムナビ */
#bnav {
	border-top: 1px solid #CCCCCC;
	}
#bnav .prev,
#bnav .top,
#bnav .next {
	font-size: 15px;
	font-weight: bold;
    overflow: hidden;
    line-height: 80px;
	}
#bnav .prev a,
#bnav .next a {
    display: inline-block;
        max-width: 320px;
        overflow: hidden;
        white-space: nowrap;
        text-overflow: ellipsis;
	}
	#bnav .inner {position: relative;}
	 #bnav .prev {
		position: absolute;
		top: 0;
		left: 0;
		}
		#bnav .prev a {
			background: url(../img/prev.gif) no-repeat left center;
			padding: 2px 0 2px 13px;
			}
	#bnav .top {
		text-align: center;
		}
		#bnav .top a {
			background: url(../img/top.gif) no-repeat left center;
			padding-left: 22px;
			}
	#bnav .next {
		position: absolute;
		top: 0;
		right: 0;
		}
		#bnav .next a {
			background: url(../img/next.gif) no-repeat right center;
			padding: 2px 13px 2px 0;
			}
			

/* ▼▼▼ フッター
=====================================*/
#footer {
	width: 100%;
	border-top: 1px solid #E60012;
	border-bottom: 10px solid #222222;
	clear: both;
	overflow: hidden;
	}
#footer .inner {
	overflow: hidden;
	}
#footer .inner1 {
    padding: 0 0 30px;
}
	ul#fnav {
		float: left;
		font-size: 10px;
		color: #999;
		overflow: hidden;
		}
		ul#fnav > li {
			float: left;
			width: 150px;
			border-right: 1px solid #CCCCCC;
			padding: 20px 0 30px 11px;
			}
			ul.fnav li {
				line-height: 1.8;
				}
				ul.fnav li.title {
					margin-bottom: 10px;
					}
				ul.fnav li.last {
					margin-bottom: 25px;
					}
				ul.fnav li.plus {
					background: url(/common/img/plus.gif) no-repeat left 4px;
					padding-left: 11px;
					margin-left: 10px;
					}
					ul.fnav li a {color: #999;}
	#footer_bnr {
		padding: 15px 0 0;
		font-size: 12px;
		text-align: center;
		overflow: hidden;
		clear: both;
		width: 960px;
		margin: 0 auto;
        color: #878787;
        line-height: 1.2;
		}
		#footer_bnr ul.bnr {
			width: 960px;
			margin: 0 auto;
			overflow: hidden;
			}
		*+html #footer_bnr ul.bnr {padding-bottom: 15px;}
			#footer_bnr ul.bnr li {
                width: 160px;
				float: left;
				margin: 0;
				text-align: center;
				margin-bottom: 15px;
				}
			#footer_bnr ul.bnr li a {
				display: block;
                margin-bottom: 5px;
				}	

		#footer_bnr .contact p {
			margin-bottom: 10px;
			}
#footer_bottom {
	clear: both;
	overflow: hidden;
	border-top: 1px solid #ccc;
}
#footer #footer_bottom .inner {
	border-right: none;
	border-left: none;
}

#footer_inner {
	border-top: 1px solid #CCCCCC;
	border-bottom: 1px solid #CCCCCC;
	padding: 30px 0 20px;
	clear: both;
	overflow: hidden;
	width: 960px;
	margin: 0 auto;
}

#footer_inner ul.footer_btn {
    width: 938px;
    margin: 0 auto;
    overflow: hidden;
}

#footer_inner ul.footer_btn li {
    width: 450px;
    height: 50px;
    float: left;
    margin: 0 26px 11px 0;
    padding: 0;
    position: relative;
    border: 1px solid #dfdfdf;
    background: linear-gradient(to bottom, #efefef 0%,#fcfcfc 100%);
}

#footer_inner ul.footer_btn li:hover {
    opacity: 0.7;
}

#footer_inner ul.footer_btn li a {
    display: block;
    width: 100%;
    height: 100%;
    border: 1px solid #fff;
}
#footer_inner ul.footer_btn li img {
    vertical-align: middle;
    height: 43px;
    margin-top: 3px;
}

#footer_inner ul.footer_btn li:nth-child(2n) {
    margin-right: 0;
}

#footer_inner ul.footer_btn li span {
    position: absolute;
    top: 18px;
    right: 10px;
    font-size: 11px;
    text-align: right;
}

#footer_inner ul.footer_btn li a span br {
    display: none;
}

#footer_inner ul.footer_btn li a:hover span {
    color:#999;
}

#footer_inner ul.footer_btn li a:hover img {
    filter:alpha(opacity=60);  /* IE7以下用 */
    -ms-filter: "alpha(opacity=60)"; /* IE8用 */
    -moz-opacity:0.6; /* Firefox 1.5未満, Netscape用 */
    -khtml-opacity: 0.6;  /* Safari 1.x, 他khtmlに対応したブラウザ用  */
    opacity: 0.6; /* Firefox 1.5以上, Opera, Safari用 */
}
#footer_inner h3 {
    font-weight: bold;
    font-size: 16px;
    border-left: 3px solid #E50012;
    padding-left: 10px;
    margin: 0 0 20px;
    line-height: 1.2;
}
#footer_contact {
	overflow: hidden;
	text-align: center;
	padding: 30px 0;
}

#footer_contact p {
    margin-bottom: 20px;
}

#footer_contact .footer_tel img {
    margin: 0 auto;
    width: 285px;
}

#footer_contact .footer_btn_contact img {
    width: 250px;
}

#footer_contact .footer_overview img {
    width: 91px;
    margin-left: 15px;
}

#footer_magazine {
    width: 580px;
    padding: 20px;
    float: left;
    background: url(/common/img/bg.gif);
}

#footer_magazine p {
    width: 145px;
    float: left;
}

#footer_magazine li {
    float: left;
    margin-left: 20px;
}

#footer_magazine li img {
    width: 192px;
}

#footer_sns {
    padding: 20px;
    width: 280px;
    float: right;
    background: url(/common/img/bg.gif);
}

#footer_sns p {
    float: left;
    line-height: 45px;
}

#footer_sns ul {
    float: right;
    padding-top: 5px;
    height: 35px;
}

#footer_sns li {
    display: inline-block;
    margin-left: 15px;
}

#footer_sns li img {
    width: 39px;
    height: 39px;
}

ul.bnav {
	float: left;
	overflow: hidden;
	}	
	ul.bnav li {
		float: left;
		margin-right: 15px;
		font-size: 10px;
		line-height: 30px;
		}
		ul.bnav li a {
			background: url(/common/img/arrow.gif) no-repeat left center;
			padding-left: 12px;
			color: #666;
			}		

#copyright {
	float: right;
	font-size: 10px;
	color: #666;
	line-height: 30px;
	}



/* ▼ ページ上部へ戻る */
.pagetop {
	position: fixed;
	top: 440px;
	right: 20px;
	outline: none;
	}



/* ▼ スライダー共通設定 */
.bx-wrapper {
	position: relative;
	}
	a.bx-prev,
	a.bx-next {
		display: block;
		width: 23px;
		height: 43px;
		position: absolute;
		z-index: 100;
		top: 155px;
		text-indent: -9999px;
		outline: none;
		}
		a.bx-prev {
			background: url(../img/slider_arrow01.png) no-repeat left top;
			left: -34px;
			}
		a.bx-next {
			background: url(../img/slider_arrow02.png) no-repeat left top;
			right: -34px;
			}
		.bx-pager {
			width: 100%;
			position: absolute;
			bottom: 10px;
			z-index: 100;
			text-align: center;
			}
			.bx-pager-item {
				display: inline-block;  
			    *display: inline;  
			    *zoom: 1;
			    margin-right: 10px;
			    text-align: center;
				}
			.bx-pager-item:last-child {margin-right: 0;}
				.bx-pager-item a {
					display: block;
					width: 12px;
					height: 12px;
					background: url(../img/slider_page01.png) no-repeat left top;
					text-indent: -9999px;
					outline: none;
					}
				.bx-pager-item a.active {
					background: url(../img/slider_page02.png) no-repeat left top;
					}

/* slick */

                  ul.slick-dots {
                    text-align: center;
                    overflow: hidden;
                  }

                  ul.slick-dots li {
                    float: none;
                    display: inline-block;
                    width: 12px;
                    margin: 10px 6px;
                  }
				ul.slick-dots li button {
                    background-color: transparent;
                    border: none;
                    cursor: pointer;
                    outline: none;
                    padding: 0;
                  color: transparent;
                    appearance: none;
                    margin: 0;
					display: block;
					width: 12px;
					height: 12px;
					background: url(/common/img/slider_page01.png) no-repeat left top;
					outline: none;
					}
				ul.slick-dots li.slick-active button {
					background: url(/common/img/slider_page02.png) no-repeat left top;
					}

                .slideArrow {
                    position: absolute;
                    width: 23px;
                    height: 43px;
                    cursor: pointer;
                }

                .slideArrowPrev {
                  background: url(/common/img/slider_arrow01.png) no-repeat;
                }
                .slideArrowNext {
                  background: url(/common/img/slider_arrow02.png) no-repeat;
                }

			
/* ▼ マウスオーバーで表示 */
ul.works {
	overflow: hidden;
	}
	ul.works li.slick-slide {
		width: 248px;
		margin-right: 7px;
		margin-left: 7px;
		position: relative;
		}
	ul.works li:last-child {margin-right: 0;}
		ul.works li p.title {
			width: 240px;
			text-align: center;
			height: 45px;
			}
			ul.works li .item {
				position: relative;
				}
			ul.works li .photo {
				background: url(../img/bg_case.png) no-repeat left top;
				padding: 1px 0 10px 1px;
				overflow: hidden;
				height:248px;
				}
			ul.works li .caption {
				display: none;
				width: 198px;
				height: 138px;
				background: url(../img/bg_caption.png) repeat;
				padding: 20px;
				position: absolute;
				top: 1px;
				left: 1px;
				color: #fff;
			    font-size: 12px;
			    line-height: 1.4;
			    cursor: pointer;
				}
				ul.works li .caption p.title02 {
					margin-bottom: 5px;
					font-size: 14px;
					}
					ul.works li .caption p.link {
						background: none;
						padding: 0;
						margin-top: 10px;
						line-height: 16px;
						text-align: center;
						}
						ul.works li .caption p.link a {
							background: url(../img/arrow_wh.png) no-repeat left center;
							padding-left: 13px;
							color: #fff;
							}
#main .inner .none_articles{
	padding-top: 7px;
	padding-bottom: 5px;
	margin-bottom: 5px;
	border-bottom: 1px dotted #E60012;
	border-top: 1px dotted #E60012;
	}
/* google search */
#header #search_box {
    position: absolute;
    top: 0px;
    right: 0px;
}
#header #search_box input.txt {
    width: 122px;
    margin: 0px 5px 0px 0px;
    height: 22px;
}

/* 404,403エラー */
#error {
	text-align: center;
}
#error h1 {
	font-size: 60px;
	font-weight: bold;
	font-family: Arial,Helvetica,sans-serif;
}
#error p {
	line-height: 1.5em;
	font-size: 16px;
}
#error ul {
	margin: 50px auto;
}
#error ul li {
	display: inline-block;
}

#error ul li:first-child {
	margin-right: 30px;
}
/*ニュース、セミナー、イベント記事のサービスバナー*/

.serviceLinkBnr h3 {
	font-weight: bold;
	text-align: left;
	border-left: 4px solid #E40011;
	padding: 0 10px;
	font-size: 16px;
	margin: 50px 0 15px;
}
}
.serviceLinkBnr {
    margin: 30px 0 0;
    padding: 20px 0;
    clear: both;
}
.serviceLinkBnr a {
	width: 285px;
	display: block;
	margin: auto;
}
.serviceLinkBnr a.linkTxt {
	width: 262px;
	padding: 2px 3px 2px 20px;
	background: #e60012 url("../img/bg_sevicelinkbner.png") no-repeat 10px center;
	color: #fff;
	font-weight: bold;
	text-align: center;
	font-size: 90%;
}
/*特集・サービス等の最新情報*/

.ica {
	padding: 0;
	overflow: hidden;
	clear: both;
}

.com_latest_news {
	padding: 30px 30px 0;
}

.com_latest_news dl {
	border-bottom: 1px dotted #E60012;
	padding-bottom: 10px;
	margin-bottom: 5px;
	overflow: hidden;
}
.com_latest_news dl.article dd {
    padding-left: 70px;
    margin-left: 90px;
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
}
.com_latest_news dl.article dt {
    float: left;
    width: 90px;
}

.com_latest_news dl.article dd.update {
    background: url(../common/img/icon_news07.gif) no-repeat left 3px;
}
.com_latest_news dl.article dd.i01,dl.article dd.i01cat1,dl.article dd.cat1i01 {background: url(https://www.kdl.co.jp/common/img/icon_news01.gif) no-repeat left 3px;}
.com_latest_news dl.article dd.i02,dl.article dd.i02cat1,dl.article dd.cat1i02 {background: url(https://www.kdl.co.jp/common/img/icon_news02.gif) no-repeat left 3px;}
.com_latest_news dl.article dd.i03,dl.article dd.i03cat1,dl.article dd.cat1i03 {background: url(https://www.kdl.co.jp/common/img/icon_news03.gif) no-repeat left 3px;}		
.com_latest_news dl.article dd.cat3,dl.article dd.cat3cat1,dl.article dd.cat1cat3 {background: url(https://www.kdl.co.jp/common/img/icon_news05.gif) no-repeat left 3px;}
.com_latest_news dl.article dd.cat2,dl.article dd.cat2cat1,dl.article dd.cat1cat2 {background: url(https://www.kdl.co.jp/common/img/icon_news04.gif) no-repeat left 3px;}
.com_latest_news dl.article dd.cat5,dl.article dd.cat1cat5,dl.article dd.cat5cat1 {background: url(https://www.kdl.co.jp/common/img/icon_news06.gif) no-repeat left 3px;}
.com_latest_news dl.article dd.update {background: url(https://www.kdl.co.jp/common/img/icon_news07.gif) no-repeat left 3px;}

.com_latest_news dl.article dd.blog {background: url(/common/img/icon_newsblog.gif) no-repeat left 3px;}

.com_latest_news h3 {
	font-size: 18px !important;
	font-weight: bold !important;
	padding-left: 10px !important;
	/*background: url(https://www.kdl.co.jp/common/img/top/bg_top_newevent.png);*/
	/*color: #fff;*/
	width: 150px !important;
	margin: 0 1em 1em 0 !important;
	float: left !important;
	padding: 82px 0 !important;
	display: table !important;
	text-align: center !important;
	vertical-align: middle !important;
	border-right: 1px dotted #E60012 !important;
	text-indent: 0 !important;
	height: auto !important;
}
.com_latest_news .article_list {
	width: 700px;
	float: left;
}
