@charset "utf-8";

/* ****************************************************************************************************
 * 大日桑テクノロジー株式会社 — スマホ対応版（現行デザイン忠実再現＋レスポンシブ）
 * reset / layout / common / index を統合
**************************************************************************************************** */

/* ===== reset ===== */
* { box-sizing: border-box; }
body { color:#666; font-size:13px; margin:0; padding:0; line-height:1.5; font-family:"Hiragino Kaku Gothic ProN","ヒラギノ角ゴ ProN W3",Meiryo,メイリオ,sans-serif; -webkit-text-size-adjust:100%; }
a { color:#408fcb; text-decoration:none; outline:none; }
a:hover { color:#408fcb; text-decoration:underline; }
a:hover img { opacity:0.8; }
h1, h2, h3, h4, h5, h6 { margin:0; padding:0; font-size:100%; font-weight:normal; }
p { margin:0; padding:0; }
p + * { margin-top:0.75em; }
* + p { margin-top:0.75em; }
img { border:none; max-width:100%; height:auto; }
table { font-size:inherit; empty-cells:show; }
form { margin:0; padding:0; }

/* ===== clearfix ===== */
.clearfix:after { content:"."; display:block; line-height:0; clear:both; visibility:hidden; }
.clear { clear:both; }

/* ****************************************************************************************************
 * header
**************************************************************************************************** */
div#header-base { border-top: solid 5px #408fcb; }
div#header { width: 960px; margin: 0 auto; padding-top: 10px; }
div#header a { color: inherit; text-decoration: none; }
div#header div.left { width: 750px; float: left; }
div#header div.right { width: 190px; float: right; }
div#header h1 { font-size: 12px; }
p#h-logo { margin-top: 0; }
p#h-contact { margin-top: 0; text-align: right; }

/* ハンバーガーボタン（スマホ専用・初期非表示） */
#navi-toggle { display: none; }

/* ****************************************************************************************************
 * global navi
**************************************************************************************************** */
div#g-navi-base {
	margin: -5px 0;
	padding: 5px 0;
	background: url(../uploads/navi-bg.png) left top repeat-x;
	position: relative;
	z-index: 100;
}
div#g-navi { width: 960px; margin: 0 auto; position: relative; z-index: 1000; }
div#g-navi ul, div#g-navi ul li { margin: 0; padding: 0; list-style: none; }
div#g-navi ul { letter-spacing: -0.4em; }
div#g-navi ul li { letter-spacing: normal; position: relative; }
div#g-navi ul li a { display: block; text-decoration: none; }

/* 2階層目（ドロップダウン） */
div#g-navi ul ul {
	min-width: 100%;
	border: solid 1px #408fcb;
	background: #fff;
	white-space: nowrap;
	visibility: hidden;
	opacity: 0;
	position: absolute;
	top: 100%;
	left: 0;
	box-shadow: 0px 0px 8px 0px rgba(0, 0, 0, 0.5);
	transition: opacity .15s;
}
div#g-navi ul ul li ~ li { border-top: dotted 1px #ddd; }
div#g-navi ul ul li a { padding: 0.5em 1em; color: #666; }
div#g-navi ul ul li a:hover { background: #f6f5f6; }

/* lv.1（画像スプライト・高さ50px、ホバー/カレントで下半分表示） */
div#g-navi > ul > li {
	height: 50px;
	vertical-align: top;
	display: inline-block;
	position: relative;
}
div#g-navi > ul > li > a { height: 100%; overflow: hidden; }
div#g-navi > ul > li > a img { display: block; transition: margin-top .1s; }
div#g-navi > ul > li:hover > a img,
div#g-navi > ul > li.current > a img { margin-top: -50px; }
div#g-navi > ul > li:hover > a img { opacity: 1.0; }

/* ホバーでドロップダウン表示（PC） */
div#g-navi > ul > li:hover > ul { visibility: visible; opacity: 1; }

/* ****************************************************************************************************
 * visual
**************************************************************************************************** */
div#visual-wrap {
	padding-bottom: 20px;
	background: url(../uploads/visual-bg-1.png) left bottom repeat-x;
}
div#visual-base {
	background: #115aba url(../uploads/visual-bg-2.png) left bottom repeat-x;
}
div#visual {
	background: url(../uploads/visual-bg-3.jpg) center bottom no-repeat;
}
div#visual p { width: 960px; margin: 0 auto; }
div#visual p img { display: block; width: 100%; }

/* ****************************************************************************************************
 * main
**************************************************************************************************** */
div#main-container { width: 960px; margin: 0 auto; padding: 30px 0 40px; }
div#main { font-size: 14px; }

/* ===== block spacing ===== */
div.section ~ div { margin-top: 50px; }

/* ****************************************************************************************************
 * business（事業内容ギャラリー）
**************************************************************************************************** */
.gallery { text-align: justify; }
.gallery:after { content: ''; width: 100%; display: inline-block; line-height: 0; visibility: hidden; }
.gallery > * { margin-top: 0; text-align: left; vertical-align: top; display: inline-block; }

div#business div.gallery { margin-top: -30px; font-size: 0; }
div#business div.gallery div.article {
	margin-top: 30px;
	width: 236px;
	font-size: 14px;
	vertical-align: top;
	display: inline-block;
}
/* 4列均等配置 */
div#business div.gallery { display: flex; flex-wrap: wrap; justify-content: space-between; }
div#business div.gallery:after { content: none; }

div#business div.gallery div.top {
	padding-top: 10px;
	background: url(../uploads/frame-top.png) center top no-repeat;
}
div#business div.gallery div.bottom {
	background: url(../uploads/frame-repeat.png) center top repeat-y;
}
div#business div.gallery div.body {
	padding: 5px 20px 20px;
	background: url(../uploads/frame-bottom.png) center bottom no-repeat;
}
div#business div.gallery div.article a { display: block; color: inherit; }
div#business div.gallery div.article h2 { height: 3em; border-left: solid 5px #408fcb; }
div#business div.gallery div.article h2 a { height: 100%; padding-left: 8px; display: block; }
div#business div.gallery div.article div.photo {
	width: 196px;
	height: 147px;
	overflow: hidden;
	margin: 10px auto;
}
div#business div.gallery div.article div.photo img { max-width: 100%; }
div#business div.gallery div.article p { min-height: 6em; }

/* ****************************************************************************************************
 * topics（新着情報）＋ rakuhou（楽報）
**************************************************************************************************** */
div#topics {
	width: 718px;
	margin-top: 30px;
	vertical-align: top;
	display: inline-block;
}
.title-2 { margin-bottom: 1em; }
div#topics div.container {
	margin: -22px 5px 0;
	padding: 0.25em 2em 0;
	border: solid 1px #d6d6d6;
}
div#topics dl { width: 100%; display: table; margin: 0; padding: 0; }
div#topics dl ~ dl { border-top: dotted 1px #d1c5ab; }
div#topics dl dt {
	padding-left: 6px;
	white-space: nowrap;
	vertical-align: top;
	display: table-cell;
	background: url(../uploads/listmark-1.png) left 1.5em no-repeat;
}
div#topics dl dd { width: 100%; vertical-align: top; display: table-cell; }
div#topics dl a { padding-top: 1.25em; padding-bottom: 1.2em; display: block; text-decoration: none; color: inherit; }
div#topics dl a[href] { color: #408fcb; }
div#topics dl a[href]:hover { color: #0063a5; text-decoration: underline; }
div#topics dl dt a { padding-left: 1em; padding-right: 0.75em; }
div#topics dl dd a { padding-left: 0.75em; }

div#rakuhou {
	width: 237px;
	margin-top: 29px;
	vertical-align: top;
	display: inline-block;
	text-align: center;
}

/* topics と rakuhou を横並び */
div#main .page-index #topics,
div#main .page-index #rakuhou { display: inline-block; }

/* ****************************************************************************************************
 * footer
**************************************************************************************************** */
div#footer-base { border-top: solid 5px #408fcb; background: #f2f2f2; position: relative; }
div#footer {
	width: 960px;
	margin: 0 auto;
	font-size: 12px;
	display: flex;
	justify-content: space-between;
	flex-wrap: wrap;
}
div#footer > div.container { margin: 20px 0; }
div#f-info { width: 260px; vertical-align: top; }
div#f-info h2 { margin-bottom: 1em; }
div#f-navi {
	width: 660px;
	padding: 10px;
	vertical-align: top;
	border-radius: 6px;
	border: solid 1px #e2e2e2;
	background: #fff;
	display: flex;
	justify-content: space-between;
	flex-wrap: wrap;
}
div#f-navi ul, div#f-navi ul li { margin: 0; padding: 0; list-style: none; }
div#f-navi ul a { color: inherit; display: block; text-decoration: none; }
div#f-navi ul a[href]:hover { color: #000; text-decoration: underline; }
div#f-navi > ul { padding: 0 0.5em; vertical-align: top; }
div#f-navi > ul > li > a {
	padding: 0.5em 0.5em 0.5em 18px;
	position: relative;
}
div#f-navi > ul > li > a:before {
	content: url(../uploads/listmark-1.png);
	position: absolute;
	left: 0;
	top: 50%;
	margin-top: -6px;
}
div#f-navi ul ul { margin-left: 1.5em; }
div#f-navi ul ul li a { padding: 0.25em 0 0.25em 18px; position: relative; }
div#f-navi > ul > li > ul > li > a:before {
	content: url(../uploads/listmark-2.png);
	position: absolute;
	left: 0;
	top: 50%;
	margin-top: -6px;
}

div#copyright { border-top: solid 1px #ccc; background: #fff; }
div#copyright p { width: 960px; margin: 0 auto; padding: 0.5em 0; line-height: 1.2; }