/*------------------------------
  トップページ用CSS
------------------------------- */

/* メインイメージ
------------------------------- */
#top_main{
padding:16px 0;
max-height:320px;
overflow:hidden;
}
#slider{
max-width:960px;
margin:0 auto;
position:relative;
}
#slider:after{
content:"";
display:block;
clear:both;
}
#top_main .txt{
position:absolute;
top:30%;
left:2%;
z-index:10;
font-size:32px;
line-height:1.2;
color:#fff;
font-style:italic;
letter-spacing:0.2em;
font-family:"ＭＳ Ｐ明朝", "細明朝体", "ヒラギノ明朝 Pro W3","Times New Roman", Times, serif;
text-shadow:1px 1px 2px rgba(0,0,0,0.8);
}
.bx-wrapper .bx-pager, .bx-wrapper .bx-controls-auto {
bottom: -18px !important;
}
#top_main .bx-wrapper .bx-pager.bx-default-pager a{
background:#fff;
display:inline-block;
}
#top_main .bx-wrapper .bx-pager.bx-default-pager a:hover,#top_main .bx-wrapper .bx-pager.bx-default-pager a.active{
background:#5EC5EA;
}
.bx-wrapper{
margin: 0px auto !important;
}
.bx-wrapper .bx-controls{
}

/* 業務内容
------------------------------- */
#business{
margin:0 0 20px;
}
#business h2 {
margin:0 0 24px;
padding:12px 6px 12px;
font-size:12px;
color:#999;
border-bottom:3px solid #5EC5EA;
}
#business h2 span{
font-size:18px;
padding:0 10px 0 0;
color:#333;
}
#business h2 span:before{
content:"\f109";
display:inline-block;
margin:0 10px 0 0;
vertical-align:middle;
font-family:FontAwesome;
font-size:32px;
color:#5EC5EA;
/*
width:64px;
text-align:center;
height:64px;
line-height:64px;
color:#fff;
background:#069;
border:2px solid #069;
-webkit-border-radius: 50%;
border-radius: 50%;
*/
}
#business section{
width:300px;
margin:0 0 20px;
}
#business #business1,#business #business3{
float:left;
clear:both;
}
#business #business2,#business #business4{
float:right;
}
#business section a{
color:#333;
text-decoration:none;
}
#business h3{
font-weight:normal;
display:block;
margin:0 0 8px;
color:#5EC5EA;
}
#business .img{
height:150px;
background:#eee;
margin:0 0 8px;
overflow:hidden;
}
#business .img img{
transition: transform 0.3s linear;
}
#business a:hover .img img{
transform: scale(1.08);
}
#business .txt{
color:#666;
line-height:1.4;
}

/* 新着情報
------------------------------- */
#news{
/*
width:300px;
float:right;
*/
clear:both;
margin:0 0 20px 0;
}
#news h2 {
margin:0 0 24px;
padding:12px 6px 12px;
color:#333;
font-size:18px;
border-bottom:3px solid #5EC5EA;
}
#news h2 span{
font-size:18px;
padding:0 0 0 10px;
font-size:12px;
color:#999;
}
#news h2:before{
content:"\f1ea";
display:inline-block;
margin:0 10px 0 0;
vertical-align:middle;
font-family:FontAwesome;
font-size:28px;
color:#5EC5EA;
}
#news li{
border-bottom:1px solid #eee;
}
#news li a{
text-decoration:none;
color:#666;
font-size:12px;
display:block;
padding:5px 48px 5px 16px;
position:relative;
}
#news li a:hover{
background:#efefef;
color:#FF6600;
}
#news li a:after{
content:"\f054";
display:block;
font-family:FontAwesome;
font-size:24px;
color:#eee;
position:absolute;
right:6px;
top:50%;
margin:-6px 0 0;
}
#news li a:hover:after{
color:#fff;
}
#news li a .date{
display:block;
margin:0 0 6px;
font-size:12px;
}

@media screen and (max-width: 740px) {
#top_main .txt{
font-size:24px;
}
}
@media screen and (max-width: 640px) {
.main{
width:98%;
margin:24px auto;
}
#top_main .txt{
font-size:20px;
}
#business section{
width:48%;
margin:0 0 20px;
}
#news h2{
margin:0 0 18px;
}
}
@media screen and (max-width: 480px) {
#top_main .txt{
font-size:18px;
letter-spacing:0.1em;
}
.main{
margin:0 1% 16px;
}
#news h2{
margin:0 0 12px;
}
#news li a{
padding:8px 32px 8px 8px;
}
#business section{
width:300px;
margin:0 auto 20px;
}
#business #business1,#business #business2,#business #business3,#business #business4{
float:none;
}
}
@media screen and (max-width: 360px) {
#top_main .txt{
font-size:14px;
}
}
@media screen and (max-width: 321px) {
#top_main .txt{
font-size:14px;
}
}

