@charset "utf-8";
/* CSS Document */
body {
font-size:1rem;
line-height:1.5em;
font-family: 'Noto Sans JP', sans-serif;
}
.mr30{
margin-right:37px;
}
.pc_dn {
display: none;
}
header{
padding:20px 0;
position: fixed;
top: 0;
width: 100%;
z-index: 100;
background-color:#fff;
opacity:0.9;
}
#headerInner{
width:980px;
margin:0 auto;
display:flex;
justify-content:space-between;
}
#headerInner h1{
margin-top:8px;
}
#headerInner p a img:hover{
opacity:0.5;
}

#headerInner p a img:nth-child(1){
margin-right:0px;
}
#mainImg{
margin-top:97px;
background-image:url(../img/img_mainImg_01.png);
background-repeat:no-repeat;
background-size:cover;
}
#mainText{
width:980px;
margin:0 auto;
padding:42px 0;
position:relative;
}
#mainText p{
text-align:center;
font-size:18px;
color:#fff;
font-weight:bold;
line-height:1.5em;
position:absolute;
top: 180px;
left: 185px;
}
#wrapper{
width:980px;
margin:0 auto;
padding-bottom:100px;
}
h2{
font-size:41px;
font-weight:bold;
color:#33445b;
text-align:center;
padding:40px 0 36px;
}
#contents #flex{
display:flex;
height:377px;
color:#fff;
}
.strength{
display:none
}
#contents #flex div.strength:nth-child(1){
background-color:#33445b;
width:287px;
padding:0 20px;
}
#contents #flex div.strength:nth-child(2){
background-color:#425b72;
width:287px;
padding:0 20px;
}
#contents #flex div.strength:nth-child(3){
background-color:#587d93;
width:286px;
padding:0 20px;
}
.strength p.number{
/*font-size:86px;
padding-bottom:10px;
border-bottom: 4px solid #fff;
width:1em;*/
margin:30px 0;
text-align:center;
}
.strength h3{
text-align:center;
font-size:20px;
font-weight:bold;
margin-bottom:1em;
line-height:1.2em;
}
/*#contents #flex div.strength:nth-child(2) h3{
margin-bottom:1em;
}*/
.strength p{
font-size:15px;
}
.box{
margin-bottom:0.5em;
}
.box img {
display: inline-block;
vertical-align: baseline;
*zoom: 1;
*display: inline;
}
.box .txt {
display: inline-block;
vertical-align: middle;
*zoom: 1;
*display: inline;
line-height:1.4em;
font-size:14px;
}
.box2 img {
display: inline-block;
vertical-align: top;
margin-bottom:1em;
}
.box2 .txt {
display: inline-block;
vertical-align: middle;
*zoom: 1;
*display: inline;
line-height:1.3em;
font-size:14px;
}
#realization{
background-color:#f2f2f2;
background-image:url(../img/bg_icon_02.png);
background-repeat:no-repeat;
width:100%;
background-position:center 0;
}
#realization h2,
#flow h2{
padding:54px 0 0;
}
#flex2{
width:980px;
margin:0 auto;
}
#realization a.thumnail {
display: block;
float: left;
overflow: hidden;
cursor:default;
}
#realization img {
height: auto;
-webkit-transition:all 0.25s ease-in-out;
transition:all 0.25s ease-in-out;
width: 100%;
vertical-align: bottom;
/*-webkit-filter: brightness(50%);
-ms-filter: brightness(0.5);
filter:brightness(50%);*/
}
#realization img:hover {
/*-webkit-filter: brightness(80%);
-ms-filter: brightness(0.8);
filter:brightness:;(80%);*/
opacity:0.8;
}
figure {
margin: 0;
overflow: hidden;
position: relative;
text-align: center;
}
a:hover>figure img {
transform: scale(1.15,1.15);
-webkit-transform:scale(1.15,1.15);
-moz-transform:scale(1.15,1.15);
-ms-transform:scale(1.15,1.15);
-o-transform:scale(1.15,1.15);
}
.realizationInner{
float: left;
width:481px;
margin-bottom:18px;
}
.realizationInner:nth-child(even){
float: left;
width:481px;
margin-left:18px;
}
.caption{
width:481px;
height:150px;
position:relative;
}
.caption p.box{
position:absolute;
color:#fff;
font-size:25px;
top:40%;
width:481px;
text-align:center;
}
.caption p.box2{
position:absolute;
color:#fff;
font-size:25px;
top:25%;
width:481px;
text-align:center;
line-height:1.2em;
}
.realizationInner div.text{
width:461px;
height:155px;
background-color: #fff;
padding: 15px 10px 25px;
float: left;
color:#070001;
line-height:1.7em;
font-size:16px;
}
.realizationInner div.text p{
padding-left: 1em;
text-indent: -1em;
}
.realizationInner div.text span{
color:#33445b;
font-size:1em;
vertical-align: top;
}
p.consultation{
text-align:center;
margin:40px 0;
}
.realizationInner.mb40{
margin-bottom:40px;
}
#flow{
width:980px;
margin:0 auto;
background-image:url(../img/bg_icon_03.png);
background-repeat:no-repeat;
background-position:center 0;
}
#flow p{
text-align:center;
margin:25px 0;
}
#flow p.red{
text-align:center;
margin:40px 0;
color:#f00;
}
.center{
text-align:center;
margin-bottom:50px;
}
.center2{
text-align:center;
margin-bottom:50px;
}


#form{
background-color:#33445b;
background-image:url(../img/bg_icon_02.png);
background-repeat:no-repeat;
width:100%;
background-position:center 0;
color:#fff;
margin-top:80px;
}
#form2{
background-color:#33445b;
width:100%;
color:#fff;
margin-top:0px;
}

#formInner{
width:980px;
margin:0 auto;
padding:80px 0 60px;
}
#form2 #formInner{
width:980px;
margin:0 auto;
padding:60px 0 60px;
}

#formInner h2{
font-size:41px;
font-weight:bold;
color:#fff;
text-align:center;
padding:0 0 36px;
}
#formInner p{
font-weight:bold;
line-height:1.5em;
}
#formInner p.cancel{
font-weight: normal;
line-height:1.5em;
font-size:0.9em;
text-align:center;
}
#formInner p.cancel a{
color:#fff;
text-decoration:underline;
}
#formInner p.cancel a:hover{
text-decoration:none;
}
.error{
color:#f00;
}

#form td,
#form2 td{
padding:0 0 25px !important;
}
#form input,
#form textarea{
	margin-bottom:5px;
}

#form input,
#form textarea,
#form2 input,
#form2 textarea{
padding:10px;
}
#form #formText th{
text-align: left;
vertical-align: top;
padding-top: 1.5em;
padding-right: 2em;
}
#form2 table#check{
width: 980px;
margin: 0 auto;
}
#form2 #check th.brt,
#form2 #check td.brt{
	border-top:1px solid #ccc;
}
#form2 #check th{
text-align: left;
padding-right: 2em;
padding-left: 1em;
border-bottom:1px solid #ccc;
width:20%;
position:relative;
}

#form2 #check td{
border-bottom:1px solid #ccc;
padding:15px 0 8px 2em !important;
width:80%;
word-break:break-all;
}

#form2 #check td div.box{
text-align: left;
border-left: 1px dotted #ccc;
padding: 15px 0 15px 20px;
line-height:1.5em;
}
#form input{
width:680px;
height:40px;
}
input,
textarea {
font-size: 18px;
}
#form textarea{
width:680px;
height:140px;
word-wrap: break-word;
}
button a img{
text-align:center;
}
button a img:hover{
opacity:0.8;
}

button{
margin-top:30px;
background-color: transparent;
border: none;
cursor: pointer;
outline: none;
padding: 0;
appearance: none;
}
.button_wrapper{
text-align:center;
margin-bottom:30px;
}
button{
width:200px;
height:60px;
color:#fff;
background-color:#f00;
font-weight:bold;
font-size:18px;
}
button.mt60{
margin-top:60px;
}

button.gray{
width:200px;
height:60px;
color:#fff;
background-color:#999;
font-weight:bold;
font-size:18px;
}

a.gray{
width:200px;
height:60px;
color:#fff;
background-color:#999;
font-weight:bold;
font-size:18px;
display:block;
}

button.long{
width:400px;
height:60px;
color:#fff;
background-color:#f00;
font-weight:bold;
font-size:18px;
}
.fs{
font-size:1.3em;
}
.mr20{
margin-right:20px;
}
button:hover{
opacity:0.8;
}
footer{
width:980px;
margin:0 auto;
display:flex;
justify-content:space-between;
padding:40px 0 50px;
align-items: flex-end;
}
footer p img{
margin-bottom:10px;
}
footer p{
color:#000;
font-size:15px;
font-weight:bold;
line-height:1.3em;
}
footer a img:hover{
opacity:0.8;
}
footer p a{
	color: #000;
	text-decoration:none;
}

footer p a:hover{
	text-decoration:underline;
}