@charset "utf-8";

/* スマホ向け：10px～499pxまで */
@media only screen and (min-width: 10px) and (max-width:499px){
body {
	width: 100%;
    margin:0 auto;
	font-family: "ヒラギノ角ゴ Pro W3", "Hiragino Kaku Gothic Pro", "メイリオ", Meiryo, Osaka, "ＭＳ Ｐゴシック", "MS PGothic", sans-serif;
	color:#000;
    background-color: #dcdcdc;
    text-align: left
}

a {color:#000;
	text-decoration:none;}
a:hover {
	color:#000;
    text-decoration:underline;}
a:hover img {
  opacity: 0.7;
  filter: alpha(opacity=70);
  -ms-filter: "alpha(opacity=70)";
}
    
/*==========================================
 ヘッダーのスタイル
===========================================*/
/*logoの設定*/  
header{
    margin:0px auto;
    background-color:white;
    }
header h1 {
	margin:0 auto 0 0;
	width:100%;
    text-align:center;
}
header h1 img {
	width:100%;
	max-width:200px;
}
header a {
    color:#000;
    text-decoration:none;}
header a:hover {
	color:#000;
    text-decoration:none;}

 /*言語切り替えスイッチ*/ 
#translate{
    width:;
    height:15px;
    margin-left:75%;
    margin-bottom:15px;
    font-size:90%;
    }
    
#dropmenu{
  *zoom: 1;
  list-style-type: none;
  width: 40%;
  margin: 0px 0px 0px 0px;
  padding: 0;
}
#dropmenu:before, .dropmenu:after{
  content: "";
  display: table;
}
#dropmenu:after{
  clear: both;
}
#dropmenu li{
  position: relative;
  width: 20%;
  float: left;
  margin: 0;
  padding: 0;
  text-align: center;
}
#dropmenu li a{
  display: block;
  margin: 0;
  padding: 15px 0 11px;
  background: #8a9b0f;
  color: #fff;
  font-size: 14px;
  line-height: 1;
  text-decoration: none;
}
#dropmenu li ul{
  list-style: none;
  position: absolute;
  z-index: 9999;
  top: 100%;
  left: 0;
  margin: 0;
  padding: 0;
}
#dropmenu li ul li{
  width: 100%;
}
#dropmenu li ul li a{
  padding: 13px 15px;
  border-top: 1px solid #7c8c0e;
  background: #6e7c0c;
  text-align: left;
}
#dropmenu li:hover > a{
  background: #6e7c0c;
}
#dropmenu li a:hover{
  background: #616d0b;
}

#normal li ul{
  display: none;
}
#normal li:hover ul{
  display: block;
}    
/*フェードイン*/
#fade-in li ul{
  visibility: hidden;
  opacity: 0;
  transition: 0s;
}
#fade-in li:hover ul{
  visibility: visible;
  opacity: 1;
}
#fade-in li ul li a{
  visibility: hidden;
  opacity: 0;
  transition: .5s;
}
#fade-in li:hover ul li a{
  visibility: visible;
  opacity: 1;
}    
        
    
    
nav{ 
    width:101%;
    background-color:#dcdcdc;
    margin-left:auto;
    margin-right:auto;
    margin-top:10px;
    border-left: 2px solid #000;}     
nav ul li {
  float: left;
  text-align: center;
  width: 100%;
  border-right: 2px solid #000;
}   
 nav ul li:first-child{
  width: 49%;
  height:50px;
  border-top: 2px solid #000;}
nav ul li:nth-child(2){
    width:48%;
    height:50px;
    border-top: 2px solid #000;}  
nav ul li:nth-child(3){
    width:49%;
    height:50px;
    border-top: 2px solid #000;}
nav ul li:nth-child(4){
    width:48%;
    height:50px;
    border-top: 2px solid #000;}
nav ul li:nth-child(5){
    width:49%;
    height:50px;
    border-top: 2px solid #000;
    border-bottom: 2px solid #000;}
nav ul li:nth-child(6){
        width: 48%;
        height:50px;
        border-top: 2px solid #000;
        border-bottom: 2px solid #000;}        
nav ul li a{
  display:block;
  padding-top: 17px;
  padding-bottom: 20px;
  font-size: 14px;
}

nav ul li a:hover {
text-decoration: none;
background-color: whitesmoke;
}
 

    
    
#contents{
   width:100%;;
   margin:0 auto;    
    } 
  
    
#contents h1{ padding-top:10px;
              padding-bottom:10px;
              padding-left:10px;}
    
/* 事務所概要の表のデザイン */  

table.officeexplain {
 width:100%;
 border-collapse: collapse; 
text-align: left; 
line-height: 1.5;
font-size:11px;
} 

table.officeexplain th { 
 width: 25%; 
 padding: 10px; 
font-weight: bold; 
vertical-align: top; 
 border: 1px solid #ccc; 
} 
table.officeexplain td { 
width: 70%; 
padding: 10px; 
vertical-align: top; 
border: 1px solid #ccc;
} 
    
footer{ background-color: #696969;
        color:white;
        margin-top: 10px;
        padding-top:40px;
        width:100%;
        text-align:center;
        float:left;}
footer section{
        width:90%;
        margin-top: ;
        margin-left:auto;
        margin-right: auto;
    }     
footer a{ color:white;}  


  
    
div#footeradvertise{width:100%;
                    margin-bottom:15px;
                    margin-left:auto;
                    margin-right: auto;}
div#footeradvertise img{width:100%;}
    
    
section#footerbox{width:40%;
                  float:left;
                margin:5%} 

section#footernavi{margin-top: 250px;}    
    
    #footernivigation{margin-top: 100px;
        margin-bottom: 100px;
        width:95%;max-width: 400px; height: 130px;
        margin-left: auto;margin-right: auto;
        text-align: left;
        font-size: 10px;}
    
    #footernivigation div{width:45%;margin:10px 2.5% 0 2.5%;float:left;}
    
    
}
/* タブレット向けのレイアウトの指定：500px～960px */
@media only screen and (min-width:500px) and (max-width:960px){ 
body {
	width: 100%;
    margin:0 auto;
	font-family: "ヒラギノ角ゴ Pro W3", "Hiragino Kaku Gothic Pro", "メイリオ", Meiryo, Osaka, "ＭＳ Ｐゴシック", "MS PGothic", sans-serif;
	color:#000;
    background-color: #dcdcdc;
    text-align: left
}

a {color:#000;
	text-decoration:none;}
a:hover {
	color:#000;
    text-decoration:underline;}
a:hover img {
  opacity: 0.7;
  filter: alpha(opacity=70);
  -ms-filter: "alpha(opacity=70)";
}
    
/*==========================================
 ヘッダーのスタイル
===========================================*/
/*logoの設定*/  
header{
    width:100%;
    margin:0px auto;
    background-color:white;
    }
header h1 {
	margin:0 auto 0 0;
	width:100%;
    text-align:center;
}
header h1 img {
	width:100%;
	max-width:200px;
}
header a {
    color:#000;
    text-decoration:none;}
header a:hover {
	color:#000;
    text-decoration:none;}
    
 /*言語切り替えスイッチ*/ 
#translate{
    width:;
    height:15px;
    margin-left:85%;
    margin-bottom:15px;
    font-size:90%
    }
    
#dropmenu{
  *zoom: 1;
  list-style-type: none;
  width: 40%;
  margin: 0px 0px 0px 0px;
  padding: 0;
}
#dropmenu:before, .dropmenu:after{
  content: "";
  display: table;
}
#dropmenu:after{
  clear: both;
}
#dropmenu li{
  position: relative;
  width: 20%;
  float: left;
  margin: 0;
  padding: 0;
  text-align: center;
}
#dropmenu li a{
  display: block;
  margin: 0;
  padding: 15px 0 11px;
  background: #8a9b0f;
  color: #fff;
  font-size: 14px;
  line-height: 1;
  text-decoration: none;
}
#dropmenu li ul{
  list-style: none;
  position: absolute;
  z-index: 9999;
  top: 100%;
  left: 0;
  margin: 0;
  padding: 0;
}
#dropmenu li ul li{
  width: 100%;
}
#dropmenu li ul li a{
  padding: 13px 15px;
  border-top: 1px solid #7c8c0e;
  background: #6e7c0c;
  text-align: left;
}
#dropmenu li:hover > a{
  background: #6e7c0c;
}
#dropmenu li a:hover{
  background: #616d0b;
}

#normal li ul{
  display: none;
}
#normal li:hover ul{
  display: block;
}    
/*フェードイン*/
#fade-in li ul{
  visibility: hidden;
  opacity: 0;
  transition: 0s;
}
#fade-in li:hover ul{
  visibility: visible;
  opacity: 1;
}
#fade-in li ul li a{
  visibility: hidden;
  opacity: 0;
  transition: .5s;
}
#fade-in li:hover ul li a{
  visibility: visible;
  opacity: 1;
}        
    
    
nav{ 
    width:101%;
    background-color:#dcdcdc; 
    margin-left:auto;
    margin-right:auto;
    margin-top:10px;
    border-left: 2px solid #000;}     
nav ul li {
  float: left;
  text-align: center;
  width: 100%;
  border-right: 2px solid #000;
}   
 nav ul li:first-child{
  width: 33%;
  height:50px;
  border-top: 2px solid #000;
  border-bottom: 2px solid #000;}
nav ul li:nth-child(2){
    width:32%;
    height:50px;
    border-top: 2px solid #000;
    border-bottom: 2px solid #000;}  
nav ul li:nth-child(3){
    width:33%;
    height:50px;
    border-top: 2px solid #000;
    border-bottom: 2px solid #000;}
nav ul li:nth-child(4){
    width:33%;
    height:50px;
    border-bottom: 2px solid #000;}
nav ul li:nth-child(5){
    width:32%;
    height:50px;
    border-bottom: 2px solid #000;}
nav ul li:nth-child(6){
        width: 33%;
        height:50px;
        border-bottom: 2px solid #000;}        
nav ul li a{
  display:block;
  padding-top: 17px;
  padding-bottom: 20px;
  font-size: 14px;
}

nav ul li a:hover {
text-decoration: none;
background-color: whitesmoke;
}
    
#contents{
   width:100%;;
   margin:0 auto;    
    }  
    
    
    
 
    
    
    
    
#contents h1{ padding-top:10px;
              padding-bottom:10px;
              padding-left:50px;}
    
/* 事務所概要の表のデザイン */  

table.officeexplain {
 width:90%;
 margin:0 auto;    
 border-collapse: collapse; 
text-align: left; 
line-height: 1.5;
font-size:11px;
} 

table.officeexplain th { 
 width: 25%; 
 padding: 10px; 
font-weight: bold; 
vertical-align: top; 
 border: 1px solid #ccc; 
} 
table.officeexplain td { 
width: 70%; 
padding: 10px; 
vertical-align: top; 
border: 1px solid #c}
    
footer{ background-color: #696969;
        color:white;
        margin-top: 10px;
        padding-top:40px;
        width:100%;
        text-align:center;
        float:left;}
footer section{
        width:90%;
        margin-top: ;
        margin-left:auto;
        margin-right: auto;
    }     
footer a{ color:white;}  

    
div#footeradvertise{width:100%;
                    margin-bottom:15px;
                    margin-left:auto;
                    margin-right: auto;}
div#footeradvertise img{width:100%;}

section#footerbox{width:40%;
                  float:left;
                margin:5%} 

section#footernavi{margin-top: 250px;}    
    
    #footernivigation{margin-top: 100px;
        margin-bottom: 100px;
        width:95%;max-width: 400px; height: 130px;
        margin-left: auto;margin-right: auto;
        text-align: left;
        font-size: 10px;}
    
    #footernivigation div{width:45%;margin:10px 2.5% 0 2.5%;float:left;}
    



}

/* PC向け全画面表示レイアウトの指定：961px以上 */
@media only screen and (min-width: 961px) {

body {
	width: 1200px;
    margin:0 auto;
	font-family: "ヒラギノ角ゴ Pro W3", "Hiragino Kaku Gothic Pro", "メイリオ", Meiryo, Osaka, "ＭＳ Ｐゴシック", "MS PGothic", sans-serif;
	color:#000;
    background-color: #dcdcdc;
    text-align: left;
}
a {
    color:#000;
	text-decoration:none;
}
a:hover {
	color:#0000cd;
    text-decoration:underline;    
}
a:hover img {
  opacity: 0.7;
  filter: alpha(opacity=70);
  -ms-filter: "alpha(opacity=70)";
}
    
    
   
    
/*==========================================
 ヘッダーのスタイル
===========================================*/
/*logoの設定*/
header{
    width:100%;
    background-color:white;}
header h1 {
	margin:0 auto 0 0;
	width:200px;
}
header h1 img {
	width:100%;
	max-width:200px;
}
header a {
    color:#000;
    text-decoration:none;}
header a:hover {
	color:#000;
    text-decoration:none;}
    
 /*言語切り替えスイッチ*/ 
#translate{
    width:;
    height:15px;
    margin-left:95%;
    margin-bottom:15px;
    font-size:90%
    }
    
#dropmenu{
  *zoom: 1;
  list-style-type: none;
  width: 40%;
  margin: 0px 0px 0px 0px;
  padding: 0;
}
#dropmenu:before, .dropmenu:after{
  content: "";
  display: table;
}
#dropmenu:after{
  clear: both;
}
#dropmenu li{
  position: relative;
  width: 20%;
  float: left;
  margin: 0;
  padding: 0;
  text-align: center;
}
#dropmenu li a{
  display: block;
  margin: 0;
  padding: 15px 0 11px;
  background: #8a9b0f;
  color: #fff;
  font-size: 14px;
  line-height: 1;
  text-decoration: none;
}
#dropmenu li ul{
  list-style: none;
  position: absolute;
  z-index: 9999;
  top: 100%;
  left: 0;
  margin: 0;
  padding: 0;
}
#dropmenu li ul li{
  width: 100%;
}
#dropmenu li ul li a{
  padding: 13px 15px;
  border-top: 1px solid #7c8c0e;
  background: #6e7c0c;
  text-align: left;
}
#dropmenu li:hover > a{
  background: #6e7c0c;
}
#dropmenu li a:hover{
  background: #616d0b;
}

#normal li ul{
  display: none;
}
#normal li:hover ul{
  display: block;
}    
/*フェードイン*/
#fade-in li ul{
  visibility: hidden;
  opacity: 0;
  transition: 0s;
}
#fade-in li:hover ul{
  visibility: visible;
  opacity: 1;
}
#fade-in li ul li a{
  visibility: hidden;
  opacity: 0;
  transition: .5s;
}
#fade-in li:hover ul li a{
  visibility: visible;
  opacity: 1;
}            
    
    
nav{ 
    width:100%;
    background-color: #dcdcdc;
    height:50px;
    border-top: 2px solid #000;
    border-bottom: 2px solid #000;
    border-left: 2px solid #000;}     
nav ul li {
  float: left;
  text-align: center;
  width: 198px;
  height:50px;
  border-right: 2px solid #000;
}    
nav ul li a{
  display:block;
  padding-top: 17px;
  padding-bottom: 20px;
  font-size: 14px;
}

nav ul li a:hover {
text-decoration: none;
background-color: whitesmoke;
}
    
#contents{
   width:1200px;
   margin:0 auto;
    }  


table.officeexplain {
 width:80%;
 margin:0 auto;
 border-collapse: collapse; 
text-align: left; 
line-height: 1.5;
font-size:11px;
} 

table.officeexplain th { 
 width: 25%; 
 padding: 10px; 
font-weight: bold; 
vertical-align: top; 
 border: 1px solid #ccc; 
} 
table.officeexplain td { 
width: 70%; 
padding: 10px; 
vertical-align: top; 
border: 1px solid #ccc;
} 
     
    
    
    
footer{ background-color: #696969;
        color:white;
        margin-top: 10px;
        padding-top:40px;
        width:100%;
        text-align:center;
        float:left;}
footer section{
        width:90%;
        margin-top: ;
        margin-left:auto;
        margin-right: auto;
    }     
footer a{ color:white;}

div#footeradvertise{width:100%;
                    height:200px;
                    margin-bottom:15px;
                    margin-left:auto;
                    margin-right: auto;}
    
    div#footeradvertisepadding{width:40%;
                    margin-left:auto;
                    margin-right: auto;}
div#footeradvertise img{width:100%;}

section#footerbox{width:40%;
                  float:left;
                margin:5%} 

section#footernavi{margin-top: 110px;}    
    
    #footernivigation{margin-top: 60px;
        margin-bottom: 60px;
        width:95%;max-width: 400px; height: 130px;
        margin-left: auto;margin-right: auto;
        text-align: left;
        font-size: 10px;}
    
    #footernivigation div{width:45%;margin:10px 2.5% 0 2.5%;float:left;}
    
    
    
}