/* IMPORT RESET */
@import url("reset.css");

/* IMPORT 12 COLUMN RESPONSIVE GS */
@import url("responsive.gs.12col.css");

/* ICOMOON */
@import url("icomoon.css");


/*	EXAMPLE STYLES */
body {
	font-family: Meiryo,"メイリオ","ＭＳ Ｐゴシック",Osaka,sans-serif;
	color: #333;
	font-size: 13px;
	background:#fff;
}

/* ----------   header  --------------------- */
header {
	padding-bottom:0px;
	background-image:url(../common_img/header_bg02.png),url(../common_img/header_bg.png);
	background-position: center bottom,0 top;
	background-color:#cafcfe;
	background-repeat:no-repeat,repeat-x;
	border-top:solid 4px #00baff;
}


/* ----------   article  --------------------- */

article {
	margin:0px 0 10px;
}

/* ----------   section  --------------------- */
section {

}

aside {
	margin:0px 0 10px;
}

#side_bar{
}

/* ----------   footer  --------------------- */
footer {
	padding:30px 0px 0px;
}

#link_area{
text-align:center;
margin:10px 0;
}


#link_area img{
margin:5px 0;
}


/* ----------   メインイメージ系  --------------------- */

#main_img {
	text-align:center;
	margin:0px 0 20px;
	padding:15px 0 15px 0;
	background:#feeade url(../images/bg_01.png) repeat center top;
}



@media only screen and (max-width: 959px) {


#main_img {
	padding:5px 0 10px 0;
}

}

.nak_tt{
  background-image:url(../common_img/nak_bg.png);
  background-position: center bottom;
  background-repeat:no-repeat;
  background-color: #fffbe9;
  padding:35px 0 35px;
  margin:0px 0px 30px 0px ;
}

.nak_tt h2{
font-weight:bold;
font-size:140%;
color:#ff7800;
text-shadow:1px 1px 2px #fff,-1px -1px 2px #fff;
}

.nak_tt span{
font-size:120%;
color:#ff7800;
padding:0px 10px 0 0;
}

@media only screen and (max-width: 959px) {


}


.banner{
background:#fff;
padding:0px 0px 10px 0px ;
margin:20px 0;
border-bottom:dotted 2px #ccc;
border-top:dotted 2px #ccc;
}

.banner .b_tt{
background:#f4f2ed;
margin:0px 0px 0px 0px ;
text-align:center;
}

/* ----------   menu  --------------------- */


#menu-box{
background:#00baff;
border-top:solid 1px #fff;
border-bottom:solid 1px #fff;
}

#menu{
  margin: 0px 0 0px;
  padding: 5px 5px 4px 5px;
  font-size:100%;
  background:url(../common_img/g_nav_li.png) no-repeat left center;
}
#menu li{
  display: block;
  float: left;
  width: 20.00%;
  margin: 0;
  background:url(../common_img/g_nav_li.png) no-repeat right center; }

#menu li a{
  display: block;
  padding: 8px 0 8px;
  color: #fff;
  text-align: center;
  font-weight:normal;
  text-decoration: none;
}

#menu li a span{
  display: block;
  padding: 0px 0 0px;
  color: #fff;
  font-size:120%;
  text-align:center;
  font-weight:normal;
}

#menu li a:hover{
  color:#fff;
  background:#0096ff;
  -webkit-border-radius:5px; -moz-border-radius:5px; border-radius:5px;
}

#menu li a:hover span{
  color:#fff;
}

#toggle{ 
 display: none;
}


@media only screen and (max-width: 959px) {


#menu{
  margin: 0px auto 0px;
}

    #menu li{
    width: 20%;
    font-size:100%;
    padding: 6px 0 2px;
  }
}
@media only screen and (max-width: 480px) {
  #menu{
    display: none;
    padding: 0px;
  }
  #menu li{
    width: 100%;
    background:#00baff;
    color: #fff;
    font-size:100%;
    border-bottom:dotted 1px #fff;
  }

  #menu li a{
    color: #fff;
    padding: 3px 0 3px;
  }

  #menu li a span{
    color: #fff;
    font-size:140%;
  }

  #toggle{
    display: block;
    position: relative;
    width: 100%;
    background:#00baff;
    border-bottom:solid 1px #fff;
  }
  #toggle a{
    display: block;
    position: relative;
    padding: 10px 0 8px;
    color: #fff;
    text-align: center;
    text-decoration: none;
  }
  #toggle:before{
    display: block;
    content: "";
    position: absolute;
    top: 50%;
    left: 10px;
    width: 20px;
    height: 20px;
    margin-top: -10px;
    background: #fff;
  }
  #toggle a:before, #toggle a:after{
    display: block;
    content: "";
    position: absolute;
    top: 50%;
    left: 10px;
    width: 20px;
    height: 4px;
    background: #00baff;
  }
  #toggle a:before{
    margin-top: -6px;
  }
  #toggle a:after{
    margin-top: 2px;
  }
}




.btn01 {
margin:5px 10px;
}

.btn01 a{
	color:#fff;
	font-weight:bold;
	text-decoration:none;
	font-size:90%;
	display:block;
	text-align:center;
	padding:0px 5px;
	line-height:30px;
	background:#ff6000;
	width:60%;
	margin:10px auto 10px;
	-webkit-border-radius: 30px; -moz-border-radius: 30px; border-radius: 30px;
}

.btn01 a:hover{
	background:#ffa800;　/* Firefox用 */  
}

.btn01 :before  { content:'\e906'; margin-right:5px;}


.side_tt{
  margin: 0px 0 0px;
  padding: 8px 0px 8px 20px;
  font-size:120%;
  color:#fff;
  font-weight:bold;
  background-image:url(../common_img/tt_bg02.png),url(../common_img/tt_bg.png);
  background-position: 0 0,center 0;
  background-repeat: no-repeat,repeat-x;
  background-color: #e19f5e;
  -webkit-border-radius: 5px 5px 0 0; -moz-border-radius: 5px 5px 0 0; border-radius: 5px 5px 0 0;
}

.side_acco{
border:solid 1px #ccc;
border-top:none;
border-bottom:solid 8px #ccc;
padding:10px;
}

.side_acco ul.side_link{

}

.side_acco ul.side_link li{padding:5px 10px 5px 0px;border-bottom:dotted 1px #ccc;font-size:120%;font-weight:bold;}
.side_acco ul.side_link li:before {font-family:icomoon;content:'\f06e';color:#df7e4f;font-size:100%;margin-right:10px;}


.dl_style_side {margin:0px 0px 0px 0px;
font-size:100%;
 }

.dl_style_side dt {
padding:5px 0px 5px 0px;
border-bottom:solid 1px #ccc;
font-weight:bold;
margin:2px 0px 0px 0px ;
color:#a6783c;
}


.dl_style_side dd ul li{padding:5px 10px 5px 10px;border-bottom:dotted 1px #ccc;}

.dl_style_side dd ul li:before {font-family:icomoon;content:'\f06e';color:#df7e4f;font-size:100%;margin-right:10px;}


.dl_style_side .open {}
.dl_style_side .open:before {font-family:icomoon;content:'\f06c';color:#64974a;font-size:120%;margin-right:10px;}
.dl_style_side dt,
.dl_style_side .close {}
.dl_style_side .close:before { font-family:icomoon;content:'\f06b';color:#ff4800;font-size:120%;margin-right:10px;}


/* ----------   サイド事務所案内  --------------------- */

.side_office_box{
margin:0px 0 30px;
background:#f5f5f5;
padding:0px 0px 10px 0px ;
}

.s_office_tt{
text-align:center;
background:#0e6aca url(../common_img/side_bg_tt.png) no-repeat right center;
border:solid 3px #b1d1ef;
padding:0%;
color:#fff;
}

.office_info{
margin:10px 0 0;
padding:90px 10px 0;
font-size:90%;
background:url(../common_img/side_bg_01.png) no-repeat center 0;
}

.side_name{
color:#a28435;
font-weight:bold;
font-size:110%;
text-align:center;
margin:5px 0px 10px 0px ;
}


.side_tel a{
color:#589f12;
font-weight:bold;
font-size:140%;
text-align:center;
margin:5px 0px 0px 0px ;
}

.side_add{
margin:0px auto 0px ;
width:200px;
}

.side_mail{
color:#b96c27;
text-align:center;
margin:10px 0px 0px 0px ;
}

@media only screen and (max-width: 768px) {

.side_office_box{
margin:0px auto 30px;
width:60%;
background:#f5f5f5;
padding:0px 0px 10px 0px ;
}

}

@media only screen and (max-width: 480px) {

.side_office_box{
margin:0px auto 30px;
width:90%;
background:#f5f5f5;
padding:0px 0px 10px 0px ;
}

}


/* ----------   業務ボックス  --------------------- */

.link_box{
width:100%;
-webkit-transition: opacity linear 0.4s; -moz-transition: opacity linear 0.4s; transition: opacity linear 0.4s;
}

.bl-hover{
	opacity:0.7;
	filter: alpha(opacity=70);
	-ms-filter: "alpha( opacity=70 )";
	background: #2f9a00;
	-webkit-transition: opacity linear 0.4s; -moz-transition: opacity linear 0.4s; transition: opacity linear 0.4s;
}

/* ----------   ポイント  --------------------- */

.point{
color:#c39a2e;
padding:5px 0px 5px 5px ;
border-bottom:dashed 1px #ccc;
font-size:140%;
font-weight:bold;
}

.point:before{content:'●';margin-right:5px;font-size:120%;}

.po_se{
padding:5px 10px 5px 25px;
color:#c39a2e;
font-size:120%;
font-weight:normal;
}

/* ----------   フッターナビ  --------------------- */

#page_up{text-align:center;}


.fotter_bg{
background:#00baff url(../common_img/fotter_bg.png) repeat-x 0 0px;
}

.fnav {
width:100%;
margin:0 0 0 20px;
padding:30px 0 0 0;
}

.fnav li{
float:left;
margin:0 20px 5px 0;
color:#fff;
}

.fnav li a:before  { content:'>'; float:left;margin-right:5px;font-size:80%;padding:0px 3px;}

.fnav li a{
display:block;
color:#fff;
}

.fnav li a:hover{
color:#fff;
text-decoration:underline;
}


#site_copy{
text-align:center;
margin:40px 0 0 0;
padding:10px;
color:#fff;
background:#0072ff;
}

/* ----------   デバイス毎の振り分け  --------------------- */


/*PC960px以上 */
@media only screen and (min-width: 960px) {

h1{
font-size:80%;
padding:0px 0 0px;
line-height:23px;
font-weight:normal;
color:#006489;
text-align:right;
}

.logo{float:left;width:333px;padding:0px 0px 15px 0px ;}

.h_info{float:right;width:392px;padding:5px 0px 15px 0px ;}

}

@media only screen and (max-width: 959px) {

header {
	padding-bottom:0px;
	border-top:solid 4px #00baff;
	background-color:#c8fcfe;
}

h1{
font-size:70%;
padding:0px 0;
line-height:23px;
font-weight:normal;
color:#006489;
text-align:right;
}


.logo{float:left;width:333px;padding:0px 0px 15px 0px ;}

.h_info{float:right;width:392px;padding:5px 0px 15px 0px ;}

}

@media only screen and (max-width: 768px) {

header {
	padding-bottom:0px;
	background-image:none;
	border-top:solid 4px #00baff;
	background-color:#c8fcfe;
}

h1{display:none;}


.logo{float:none;width:300px;margin:0 auto;padding:17px 0px 10px 0px ;}

.h_info{float:none;width:300px;padding:20px 0px 20px 0px ;margin:auto;text-align:center;}

.h_info .tel{
     float:none;
     width:200px;
     margin:10px auto 0;
     text-align:center;}


.h_info .h_contact{
     float:none;
     width:200px;
     margin:0px auto 0;
     text-align:center;}


#side_bar{display:none;}
#pan {display:none;}



}

@media only screen and (max-width: 480px) {


}


/* ロールオーバーで不透明度変更
-------------------------------------------------- */
.hover_img a:hover img,
a.hover_img:hover img {
	opacity:0.7;
	filter: alpha(opacity=70);
	-ms-filter: "alpha( opacity=70 )";
	background: #fff;
	-webkit-transition: opacity linear 0.4s; -moz-transition: opacity linear 0.4s; transition: opacity linear 0.4s;
}

/* 画像のスタイル
-------------------------------------------------- */

.img_left{
float:left;
margin:0px 10px 0px 0px ;
}

@media only screen and (max-width: 768px) {

.img_left{
display:none;
}

}

/* タイトルのスタイル
-------------------------------------------------- */

.tt_style01{
font-size: 130%; 
color: #fff;
padding:5px 0 4px 25px;
margin:20px 0px 15px;
font-weight:bold;
text-shadow:1px 1px 3px #666;
background-image:url(../common_img/h3_bg04.png),url(../common_img/h3_bg02.png),url(../common_img/h3_bg03.png);
background-position:1.5% center,right 0,0 0;
background-repeat: no-repeat,no-repeat,repeat-x;
background-color: #1277d7;
border:solid 1px #0b64c1;
box-shadow:1px 1px 1px #fff inset,-1px -1px 1px #fff inset;
}

.tt_style01 span{
padding:0px 10px 0px 0px;
color:#7bba34;
}

.tt_style01:first-child{
margin:0px 0px 15px;
}

.tt_style02{
font-size: 120%; 
color: #000;
padding:0px 0 8px 5px;
margin:20px 0px 15px;
font-weight:bold;
background: url(../common_img/h3_bg01.png) repeat-x 0 bottom;
}

.tt_style02 span{
padding:0px 10px 0px 0px;
color:#7bba34;
}

.tt_style02:first-child{
margin:0px 0px 15px;
}

.tt_style02:before  { content:'\e010'; margin-right:5px;color:#00a2ff;}