@charset "utf-8";

#construction .contents .main section{
	padding: 10px 0 60px;
}

#construction .accent{
	background: url(../../images/construction/mainvisual.jpg) 50% 50% no-repeat;
	margin-bottom:0;
}
#construction .accent.patrolimg{
	background: url(../../images/construction-patrol/mainvisual.jpg) 50% 50% no-repeat;
}
#construction .accent p.btnPatrol,
#construction .accent p.btnConstruction {
    position: absolute;
    top: 25%;
    right: 0;
    background-color: #fff;
    border-radius: 50%;
    text-align: center;
    padding: 20px 28px;
}
#construction .accent p.btnPatrol:hover {
    background-color: rgba(255,255,255,0.9);
}
#construction .accent p.btnConstruction {
    background-color: #102D8E;
    color: #fff;
}
#construction .accent p.btnConstruction:hover {
    background-color: rgba(16,45,142,0.6);
}
#construction .accent p.btnPatrol img,
#construction .accent p.btnConstruction img {
    display: block;
    text-align: center;
    width: 35px;
    margin: 0 auto 5px;
}
.main section h3 {
    text-align: center;
    margin-bottom: 50px;
}

/* ====================
		tabarea
====================== */
#tabarea{
	padding:0;
	border-bottom: 1px solid #d1d1d1;
}
#tabarea ul.tab{
	width:1000px;
	margin: auto;
}
#tabarea ul.tab li{
	width:16.6%;
    float: left;
	text-align: center;
	position: relative;
}
#tabarea ul.tab li a{
	color:#333;
	display:block;
	padding: 20px 0;
}
#tabarea ul.tab li.select {
	background:#102d8e;
}
#tabarea ul.tab li.select a{
	color:#fff;
}
#tabarea ul.tab li.select:after {
    border-style: solid;
    border-width: 10px 10px 0;
    content: " ";
    left: 53%;
    bottom: -8px;
    position: absolute;
    border-color: #102d8e transparent;
    margin-left: -18px;
}
#tabarea ul.tab li a:hover{
	text-decoration:none;
	background:#102d8e;
	color:#fff;
}

/* ====================
searchform
====================== */
#construction form {
	margin-top: 20px;
    margin-bottom: 15px;
    text-align: right;
}
#construction input.keyword {
    padding:10px 10px 10px 45px;
    color:#444;
    border:solid 1px #d1d1d1;
    margin:0;
    width:40%;
    background: url(../../images/construction/icon_search.png) 3% 50% no-repeat;
    font-size: 15px;
}
#construction input.searchsubmit {
    background: #102d8e;
    color: #fff;
    border: none;
    font-size: 15px;
    padding: 16px 35px;
}

/* ====================
innerTab
====================== */
#construction ul.innerTab {
	margin-top: 30px;
}

/* ====================
constructionList
====================== */
#construction section#constructionList {
    padding-top: 0;
    padding-bottom: 30px;
}
#construction ul.list li{
	width: 22%;
    margin-right: 4%;
    float: left;
    margin-bottom: 3%;
}
#construction ul.list li:nth-child(4n){
	margin-right:0;
}

/* ====================
notentry
====================== */
#construction p.notentry {
    text-align: center;
    font-size: 120%;
    padding: 50px 0 20px;
}

/* ====================
pager
====================== */
#construction .pager {
    margin:10px 0 10%;
    text-align:center;
}
#construction .pager ul {
    display: inline-block;
}
#construction .pager li {
    display: inline-block;
    margin-right: 7px;
}
#construction .pager li:last-child {
    margin-right: 0;
}
#construction .pager li .page-numbers {
    display: block;
    padding: 13px 20px;
    border: 1px solid #102d8e;
    color: #102d8e;
    background-color: #fff;
}
#construction .pager li span.current {
    color: #fff;
    background-color: #102d8e;
}

/* ====================
construcrionDetail
====================== */
section.construcrionDetail dl.print {
	position: relative;
    padding: 20px;
    border: 3px solid #ccc;
	margin-bottom: 40px;
}

section.construcrionDetail dl.print dt{
	font-weight: 700;
	margin-bottom: 6px;
}
section.construcrionDetail dl.print dd p.btn{
	position: absolute;
	top: 15px;
	right: 15px;
	margin-bottom: 5px;
	text-align: right;
}
section.construcrionDetail dl.print dd p.btn a{
	box-sizing: border-box;
	width: 200px;
	display: inline-block;
	border:2px solid #102d8e;
	padding:8px 30px;
	color:#102d8e;
	text-decoration:none;
	position:relative;
	transition: 0.3s;
	text-align: center;
}
section.construcrionDetail dl.print dd p.btn a:after{
	position: absolute;
    top: 50%;
    right: 5%;
    margin-top: -4px;
    content: "";
    width: 8px;
    height: 8px;
    border: solid #102d8e;
    border-width: 2px 2px 0 0;
    transform: rotate(45deg);
	transition: 0.3s;
}

section.construcrionDetail dl.print dd p.btn a:hover{
	background:#102d8e;
	color:#fff;
}
section.construcrionDetail dl.print dd p.btn a:hover:after{
    border: solid #fff;
    border-width: 2px 2px 0 0;
}

section.construcrionDetail dl.print dd p{
	margin: 0;
}


section.construcrionDetail h3 {
    text-align: left;
    padding-bottom: 15px;
    border-bottom: 1px solid #102d8e;
}
section.construcrionDetail .accentBox {

}
section.construcrionDetail .accentBox:after {
	clear: both;
	display: block;
	content: "";
}

section.construcrionDetail .accentBox .imageArea,
section.construcrionDetail .accentBox p.mainImg {
    float: left;
    width: 49%;
}

section.construcrionDetail .accentBox .imageArea {

}

	section.construcrionDetail .images{
		margin-bottom:15px;
	}
	
	section.construcrionDetail .images,
	section.construcrionDetail .thumb{
		display: none;	
	}

	section.construcrionDetail .images.slick-initialized,	
	section.construcrionDetail .thumb.slick-initialized{
		display: block;
		animation: show 1s linear 0s;
	}
	
	@keyframes show{
		from{
			opacity: 0;
		}
		to{
			opacity: 1;
		}
	}
	
	section.construcrionDetail  ul.thumb li{
		margin-right:20px;
		border:3px solid #fff;
	}
	
	section.construcrionDetail  ul.thumb li:last-child{
		margin-right:0;
	}
	section.construcrionDetail .slider img {
		width: 100%;
		height: auto;
	}
	
	section.construcrionDetail .thumb li.slick-slide{
		outline:none;
		filter			: alpha(opacity=55);
		-moz-opacity	: 0.55;
		opacity			: 0.55;
		cursor:pointer;
	}
	
	
	section.construcrionDetail .thumb li.slick-active{
		filter			: alpha(opacity=100);
		-moz-opacity	: 1;
		opacity			: 1;
		border:3px solid #102D8E;
	}


section.construcrionDetail .accentBox table {
    float: right;
    width: 47%;
    border-top: 1px solid #d7d7d7;
}
section.construcrionDetail .accentBox table tr {
    border-bottom: 1px solid #d7d7d7;
}
section.construcrionDetail .accentBox table th,
section.construcrionDetail .accentBox table td {
    padding: 20px 0;
}
section.construcrionDetail .accentBox table th {
    width: 30%;
}

/* ====================
range
====================== */
#construction .contents .main section.range {
	display:table;
	background:#f2f2f2;
	padding:0;
	margin:40px 0;
}

.contents .main section.range > *{
	box-sizing:border-box;
	margin:0;
	display:table-cell;
	vertical-align:middle;
}

.contents .main section.range dl.explain{
	background:#f2f2f2;
	vertical-align:top;
	padding:40px;
}

.contents .main section.range dl.explain dt{
	font-size: 180%;
	color:#0b2596;
	font-weight:700;
	padding-bottom:15px;
	margin-bottom:35px;
    background: url(../../images/common/h3_bg.png) 0% 100% no-repeat;
}
.contents .main section.range p.image{
	width:50%;
}
.contents .main section.range p.image img{
	width:100%;
}

/* ====================
result
====================== */
.contents .main section.result {
    padding-top: 40px;
}
section.result h4 {
    background: #e1e8ff;
    border-radius: 3px;
    padding: 20px;
    font-size: 120%;
    margin-bottom: 25px;
}
section.result table.patrolList {
    border: 1px solid #d7d7d7;
    width: 100%;
}
section.result table.patrolList.second {
	margin-top: -1px;
}
section.result table.patrolList tr {
    border-bottom: 1px solid #d7d7d7;
}
section.result table.patrolList tr th {
    border-right: 1px solid #d7d7d7;
    background: #f2f2f2;
    width: 6%;
    text-align: center;
}

section.result table.patrolList tr td {
    padding: 15px;
}
section.result table.patrolList p.title {
    font-size: 133%;
    font-weight: bold;
    color: #102d8e;
    margin-bottom:8px;
    vertical-align: middle;
}
section.result table.patrolList p.title span {
    color: #fff;
    background: #102d8e;
    font-size: 75%;
    padding: 3px 15px;
    display: inline-block;
    margin-right: 10px;
}
section.result table.patrolList div {
    overflow: hidden;
}
section.result table.patrolList div p.patrolImg {
    float: left;
    width: 184px;
    margin-bottom: 0;
}
section.result table.patrolList div table {
    float: right;
    width: 680px;
    border-top: 1px solid #d7d7d7;
}
section.result table.patrolList div table th {
    width: 20%;
}
section.result table.patrolList div table th a {
    text-decoration: underline;
}
section.result table.patrolList div table td {
    padding: 8px 20px;
}

section.result table.patrolList table.red tr th {
    background: #FFE7E7;
}

section.result table.patrolList div table .red{
	color: red;
}


section.result table.patrolList div table a.button {
	box-sizing: border-box;
	display: inline-block;
	padding:8px 20px;
	color:#fff;
	background: #102d8e;
	text-decoration:none;
	position:relative;
	transition: 0.3s;
	text-align: center;
	border-radius: 4px;
}
section.result table.patrolList div table a.button:after{
	position: absolute;
    top: 50%;
    right: 9%;
    margin-top: -2px;
    content: "";
    width: 4px;
    height: 4px;
    border: solid #fff;
    border-width: 1px 1px 0 0;
    transform: rotate(45deg);
	transition: 0.3s;
}
section.result table.patrolList div table a.button:hover{
	opacity: 0.8;
}

dl.remarks {
    padding: 25px;
    border: 5px solid #f2f2f2;
}
dl.remarks dt {
    font-size: 120%;
    font-weight: bold;
    margin-bottom: 10px;
}

/* 確認画面 */
section.result table.patrolList.checkTable tr th {
    width: 26%;
}

section.result p.buttonStyle {
	margin-top:60px;
}


@media only screen and
(max-width : 740px) {
    
#construction .contents .mainvisual h2 {
    top: 27%;
}
#construction .accent p.btnPatrol,
#construction .accent p.btnConstruction {
    position: absolute;
    top: auto;
    right: auto;
    bottom: 5%;
    left: 20%;
    border-radius: 5px;
    text-align: center;
    padding: 5px 0;
    width: 60%;
    box-sizing: border-box;
    vertical-align: middle;
}
#construction .accent p.btnPatrol br,
#construction .accent p.btnConstruction br {
    display: none;
}
#construction .accent p.btnConstruction {
    background-color: #102D8E;
    color: #fff;
}
#construction .accent p.btnPatrol img,
#construction .accent p.btnConstruction img {
    display: inline-block;
    width: 20px;
    margin: 0 5px 0 0;
}
	
#tabarea ul.tab {
    width: auto;
}

#tabarea ul.tab li {
    width: 50%;
}

/* ====================
		index
====================== */
section.construcrionDetail dl.print {
	display: none;
}
	
section.construcrionDetail h3 {
	font-size:120%;
	margin-bottom:4%;
	padding:1%;
}

section.construcrionDetail .accentBox .imageArea,
section.construcrionDetail .accentBox p.mainImg {
    float: none;
    width: auto;
	margin-bottom:4%;
}

section.construcrionDetail .accentBox .imageArea {

}

	section.construcrionDetail .images{
		margin-bottom:5px;
	}

	section.construcrionDetail  ul.thumb li{
		margin-right:5px;
	}

section.construcrionDetail .accentBox table {
    float: none;
    width: 100%;
}

section.construcrionDetail .accentBox table th, section.construcrionDetail .accentBox table td {
    padding: 2% 0;
}


/* ====================
constructionList
====================== */
#construction section#constructionList {
    padding-top: 0;
    padding-bottom: 30px;
}
#construction ul.list{
    overflow: hidden;
    padding: 0 3%;
}
#construction ul.list li{
    width: 48%;
    margin-right:4%;
    margin-bottom: 3%;
}
#construction ul.list li:nth-child(2n){
	margin-right:0;
}

/* ====================
construcrionDetail
====================== */
#construction .contents .main section.construcrionDetail {
	padding-left:3%;
	padding-right:3%;
}

/* ====================
range
====================== */
#construction .contents .main section.range {
	display:block;
	margin:4% 0;
}

.contents .main section.range > *{
	display:block;
}

.contents .main section.range dl.explain{
	padding:4%;
}

.contents .main section.range dl.explain dt{
	    font-size: 120%;
	color:#0b2596;
	padding-bottom:2%;
	margin-bottom:3%;
}
.contents .main section.range p.image{
	width:auto;
}
.contents .main section.range p.image img{
	width:100%;
}

/* ====================
result
====================== */
.contents .main section.result {
    padding: 6% 0 0 0;
}
section.result h4 {
    padding: 4%;
    margin-bottom: 3%;
}

section.result table.patrolList p.title {
    font-size: 100%;
}

section.result table.patrolList div p.patrolImg {
    float: none;
    width: auto;
    margin-bottom: 3%;
	text-align:center;
}
section.result table.patrolList div table {
    float: none;
    width: 100%;
    border-top: 1px solid #d7d7d7;
}

section.result table.patrolList tr td {
    padding: 2%;
}

section.result table.patrolList img{
	height:auto;
}

section.result p.buttonStyle {
	margin-top:6%;
}

section.result p.buttonStyle a{
	width:80%;
	padding:10px 5px;
}


dl.remarks {
    padding: 2% 4%;
}
dl.remarks dt {
    font-size: 100%;
    margin-bottom: 2%;
}