@charset "UTF-8";
/* CSS Document */
*, *:before, *:after {
    -webkit-box-sizing: border-box;
       -moz-box-sizing: border-box;
         -o-box-sizing: border-box;
        -ms-box-sizing: border-box;
            box-sizing: border-box;
}
html {
font-size: 16px;
}
body{
background-color: #fff;
font-family:"游ゴシック Medium",YuGothic,YuGothicM,"Hiragino Kaku Gothic ProN","Hiragino Kaku Gothic Pro",メイリオ,Meiryo,sans-serif;
}
div{
line-height: 1.8em;
}
a, a:link, a:visited {
    text-decoration: none;
    color: #000;
}
a:hover {
    text-decoration: none;
    color: #000;
	filter:alpha(opacity=80);
	opacity:0.8;
}
a:active {
    text-decoration: none;
    color: #000;
	filter:alpha(opacity=80);
	opacity:0.8;
}
h1,h2,h3,h4{
font-family: "MotoyaKyotaiStd-W4";
}
p{
margin: 0;
padding: 0;
}

/*top*/
.ll-box{
width: 100%;
margin: 0;
padding: 0;
}
.l-box{
max-width: 1130px;
margin: 0 auto;
padding: 0 15px;
}
.m-box{
max-width: 900px;
margin: 0 auto;
padding: 0 20px;
}
.s-box{
max-width: 500px;
margin: 0 auto;
padding: 0 20px;
}
.navbar-brand img{
width: 300px;
}
.r-line{
height: 10px;
background-image: url("../img/r_line.jpg");
background-size: 100%;
}

/*contents*/
.carousel-item img{
width: 100%;
}
#tag{
}
#tag div{
margin-top:-50px;
text-align: center;
}
#tag img{
margin: 0 1%;
position: relative;
z-index: 9999;
}

#detail{}
#detail .title{
display: block;
margin: 0 auto;
}
#detail h3{
border: 1px solid #dbdcdc;
position: relative;
text-align: left;
margin-top: 20px;
padding: 5px;
}
#detail .title_sub{
position: absolute;
top:-15px;
left: 0;
}
#detail span{
display: inline-block;
padding-left: 245px;
}
#detail .text{
margin-top: 30px;
}
#detail .text h4{
font-size: 130%;
}
#detail .text img{
width: 100%;
}
#detail .point{
margin-top: 30px
}
#detail .point h5{
font-size: 120%;
font-weight: 700;
margin-top: 5px
}
#detail .point-img{
width: 100%;
}
#detail p{
text-align: left;
margin-top: 10px;
}

#service{
margin-top: 50px;
padding: 30px 10px 40px;
background: url("../img/service_back.png") no-repeat;
background-position: 100% 100%;
background-position: center;
text-align: center;
}
#service img{
width: 100%;
}
#service .title{
max-width: 485px;
}
#service .icon01{
position: relative;
}
#service .icon02{
position: absolute;
top:-10px;
left: -5px;
width: auto;
}
#service .col-md-4{
text-align: left;
margin-top: 20px;
}
#service .text{
margin-top: 15px;
}

#greeting{
padding: 20px 10px;
text-align: center;
}
#greeting h3{
margin-bottom: 0;
}
#greeting img{
width: 100%;
}
#greeting .title{
max-width: 700px;
}
#greeting .text{
padding: 15px;
text-align: left;
border-radius:15px;
background-color: #fffddb;
font-family: "MotoyaKyotaiStd-W4";
}

#shikaku{
margin-top: 30px;
text-align: center;
}
#shikaku h3{
padding: 0 15px;
}
#shikaku h4{
margin-top: 15px;
background-color: #000;
color: #fff;
border-radius: 10px;
padding: 5px 10px;
width: auto;
text-align: center;
}
#shikaku .title{
width: 100%;
max-width: 700px;
}
#shikaku .text{
text-align: left;
}
#shikaku .text img{
margin: 10px;
}
.loop_wrap {
  display: -webkit-flex;
  display: flex;
  width: 100vw;
  height: 300px;
  left: 50%;
  margin-left: -50vw;
  overflow: hidden;
}

/* ------------------------------
   loopSlider
------------------------------ */
.loopSliderWrap {
    top: 0;
    left: 0;
    height: 210px;
    overflow: hidden;
    position: absolute;
}
 
.loopSlider {
    margin: 0 auto;
    width: 100%;
    height: 210px;
    text-align: left;
    position: relative;
    overflow: hidden;
	margin-bottom: 15px;
}
 
.loopSlider ul {
    height: 210px;
    float: left;
    overflow: hidden;
}
 
.loopSlider ul li {
    width: auto;
    height: 210px;
    float: left;
    display: inline;
    overflow: hidden;
}
 
/* ------------------------------
   CLEARFIX ELEMENTS
------------------------------ */
.loopSliderWrap:after {
    content: "";
    display: none;
    clear: none;
}

  

#case {
margin-top: 30px;
}
#case .case-box{
margin-top: 15px;
border-radius: 10px;
background-color: #003892;
color: #fff;
padding: 15px;
}
#case .case-box{
margin-top: 10px;
border-radius: 10px;
background-color: #003892;
color: #fff;
padding: 15px;
}
#case h3{
font-size: 130%;
}
#case span{
display: inline-block;
background: url("../img/case_line.png") no-repeat;
background-position: bottom center;
padding: 10px 10px 15px;
margin-left: 10px;
}
#case .row{
margin-top: 10px;
}
#case .row img{
width: 100%;
}
#case .text{
border-bottom: 1px #fff solid;
padding-bottom: 15px;
margin-bottom: 15px;
border-top: 1px #fff solid;
padding-top: 15px;
margin-top: 15px;
}

#slide{
margin-top: 30px;
}
.mb60{
margin-bottom: 60px;
}	
.swiper-container{
text-align: center;
}
.swiper-container .swiper-slide img{
max-width: 100%;
width: 100%;
height: auto;
}
.prettyprint{
border: none;
background: #fafafa;
color: #697d86;
}
#thumbs {
height: 20%;
box-sizing: border-box;
padding: 10px 0;
}
#thumbs .swiper-slide {
width: 20%;
height: 100%;
opacity: 0.2;
cursor: pointer;
}
#thumbs .swiper-slide-active {
opacity: 1;
}

#flow{
margin-top: 30px;
}
#flow img{
width: 100%;
}

#sdgs{
margin-top: 50px;
}
#sdgs img{
width: 100%;
}
#sdgs span{
margin-bottom: 20px;
display: block;
padding: 0 15px;
}
#sdgs p{
margin-top: 10px;
}

#q-and-a{
margin-top: 50px;
padding: 30px 10px 10px;
background: url("../img/q-and-a_back.jpg") repeat;
background-position: 100%;
background-position: center;
}
#q-and-a h3{
text-align: center;
margin-bottom: 20px;
}
#q-and-a img{
width: 100%;
}
#q-and-a .row{
border-bottom: 1px #666 dashed;
padding-bottom: 15px;
margin-bottom: 15px;
}
#q-and-a .row:last-child {
border: none;
}

#info{
margin-top: 40px;
}
#info h3{
text-align: center;
padding: 30px 15px 15px;
}
#info p{
margin-top: 10px;
text-align: center;
}
#info .ip{
font-size: 80%;
margin-bottom: 30px;
}
#formWrap table{
margin: 20px auto;
}
#formWrap table td,#formWrap table th{
padding:10px;
}
#formWrap table th{
font-weight:normal;
}
#formWrap span{
font-size: 75%;
}
#info .line {
margin: 20px auto 50px;
}
#info .line img{
width: 100%;
}

#company{
margin-top: 30px;
text-align: center;
}
#company img{
width: 500px
}
#company p{
margin-top: 30px;
}
#company span{
font-size: 200%;
font-weight: 800;
}
.ggmap {
margin-top: 20px;
position: relative;
padding-bottom: 25%;
padding-top: 30px;
height: 0;
overflow: hidden;
}
.ggmap iframe,
.ggmap object,
.ggmap embed {
position: absolute;
top: 0;
left: 0;
width: 100%;
height: 100%;
}
#company .pamp img{
width: 100px;
display: inline-block;
border: 1px solid #ABABAB;
margin-bottom: 0.8rem;
}
#company .banner p{
margin-top: 10px;
}
#company .banner img{
width: auto;
}


/*footer*/
footer{
background-color: #F0F0F0;
margin-top: 100px;
text-align: center;
}
#f-menu{
margin: 0 auto 20px;
text-align: left;
padding: 0 20px;
}
footer .col-xs{
margin-top: 30px;
}
footer h4{
font-size: 100%;
font-weight: 700;
white-space: nowrap;
color: #595757;
margin-top: 20px;
margin-bottom: 15px;
letter-spacing: 0.05em;
}
a, a:link, a:visited    {  
text-decoration: none;  
color: #595757;
}  
footer a:hover {  
text-decoration: underline;
color: #595757;
}
footer a:active {  
text-decoration: underline;  
color: #595757;
}
footer p{
font-size: 85%;
margin: 7px 0 0 7px;
line-height: 1.2em;
}
footer hr{
border-color: #808080;
margin: 40px 0 20px;
}
.f-logo{
margin-top: 0;
}
#f-address{
margin: 0 auto;
text-align: left;
padding: 0 20px 30px;
}
#f-address .col-xs{
margin-top: 10px;
letter-spacing: 1.5em;
}

#f-address span,address{
display: inline-block;

margin: 0 12px;
}
address{
font-size: 85%;
line-height: 1.8em;
}