@charset "utf-8";
@import "common.css";


/*==============================
	下層ページヘッダー画像
==============================*/
@media screen and (min-width: 768px) {
.service-visual{
background-image: url(../images/service-visual.jpg);
height: 200px;
background-position: center top;
background-repeat: no-repeat;
  background-size: cover;
}
.point-visual{
background-image: url(../images/point-visual.jpg);
height: 200px;
background-position: center top;
background-repeat: no-repeat;
  background-size: cover;
}
.price-visual{
background-image: url(../images/price-visual.jpg);
height: 200px;
background-position: center top;
background-repeat: no-repeat;
  background-size: cover;
}
.faq-visual{
background-image: url(../images/faq-visual.jpg);
height: 200px;
background-position: center top;
background-repeat: no-repeat;
  background-size: cover;
}
.staff-visual{
background-image: url(../images/stafft-visual.jpg);
height: 200px;
background-position: center top;
background-repeat: no-repeat;
  background-size: cover;
}
.profile-visual{
background-image: url(../images/profile-visual.jpg);
height: 200px;
background-position: center top;
background-repeat: no-repeat;
  background-size: cover;
}
.contact-visual{
background-image: url(../images/contact-visual.jpg);
height: 200px;
background-position: center top;
background-repeat: no-repeat;
  background-size: cover;
}
.privacy-visual{
background-image: url(../images/privacy-visual.jpg);
height: 200px;
background-position: center top;
background-repeat: no-repeat;
  background-size: cover;
}
.sitemap-visual{
background-image: url(../images/sitemap-visual.jpg);
height: 200px;
background-position: center top;
background-repeat: no-repeat;
  background-size: cover;
}
.page-title {
	letter-spacing: .3rem;
	color: #FFF;
	font-size: 2.3rem;
	text-align: center;
	margin-top: 8rem;
	font-weight: bold;
}
}

@media screen and (min-width: 768px) and (max-width: 1023px)  {
.service-visual, .point-visual, .price-visual, .faq-visual, .staff-visual, .profile-visual, .contact-visual, .privacy-visual, .sitemap-visual{
 margin-top: 80px!important;
}
}

@media screen and (max-width: 767px) {
.service-visual{
	background-image: url(../images/service-visual.jpg);
 height: 150px;
 background-position: center top;
 background-size: 300% auto;
 margin-top: 50px!important;
 background-repeat: no-repeat;
}
.point-visual{
background-image: url(../images/point-visual.jpg);
 height: 150px;
 background-position: center top;
 background-size: 300% auto;
 margin-top: 50px!important;
 background-repeat: no-repeat;
}
.price-visual{
background-image: url(../images/price-visual.jpg);
 height: 150px;
 background-position: center top;
 background-size: 300% auto;
 margin-top: 50px!important;
 background-repeat: no-repeat;
}
.faq-visual{
background-image: url(../images/faq-visual.jpg);
 height: 150px;
 background-position: center top;
 background-size: 300% auto;
 margin-top: 50px!important;
 background-repeat: no-repeat;
}
.staff-visual{
background-image: url(../images/stafft-visual.jpg);
 height: 150px;
 background-position: center top;
 background-size: 300% auto;
 margin-top: 50px!important;
 background-repeat: no-repeat;
}
.profile-visual{
background-image: url(../images/profile-visual.jpg);
 height: 150px;
 background-position: center top;
 background-size: 300% auto;
 margin-top: 50px!important;
 background-repeat: no-repeat;
}
.contact-visual{
background-image: url(../images/contact-visual.jpg);
height: 200px;
background-position: center top;
background-repeat: no-repeat;
}
.privacy-visual{
background-image: url(../images/privacy-visual.jpg);
 height: 150px;
 background-position: center top;
 background-size: 300% auto;
 margin-top: 50px!important;
 background-repeat: no-repeat;
}
.sitemap-visual{
background-image: url(../images/sitemap-visual.jpg);
 height: 150px;
 background-position: center top;
 background-size: 300% auto;
 margin-top: 50px!important;
 background-repeat: no-repeat;
}
.page-title{
	letter-spacing: .3rem;
	color: #FFF;
	font-size: 2.3rem;
	text-align: center;
	margin-top: 6rem;
	font-weight: bold;
}
}

/*==============================
	サービス案内
==============================*/
.service-top-box{
padding: 20px;
border: 1px solid #B3B3B3;
border-radius: 10px;
background-color: #F0F4F7;
height: 100%;
}
.main-works{
border-radius: 10px;
background-color: #217FC4;
}
.service-title{
font-size: 2.2rem;
font-weight: bold;
color: #FFF;
text-align: center;
}
.service-title2{
font-size: 1.8rem;
border-bottom: 1px dotted #0051A4;
padding-bottom: 3px;
font-weight: bold;
}
.service-title2-2{
font-size: 1.8rem;
font-weight: bold;
}
.service-title3{
font-size: 2.2rem;
font-weight: bold;
color: #0051A4;
text-align: center;
border-bottom: 1px solid #0051A4;
margin-bottom: 10px;
padding-bottom: 5px;
}
.service-box-in1{
background-color: #FFF;
padding: 20px;
border-radius: 10px;
}
.service-top-title a{
font-size: 2.2rem;
font-weight: bold;
color: #0051A4;
border-bottom: 1px dotted #0051A4;
padding-bottom: 10px;
display: block;
}
.service-top-box p{
line-height: 1.7em;
}
.service-flow{
background-color: #F7FAFD;
}
.service-top-list li{
color: #0051A4;
float: left;
font-weight: bold;
font-size: 1.7rem;
line-height: 1.7em;
padding-left: 1em;
text-indent: -1em;
}
@media (max-width: 1023px) {
  .service-top-list li{
    font-size: 1.6rem;
    float: none;
  }
}

.fa-dot-circle{
color: #0051A4;
}
.service-document th{
background-color: #F2FAFD;
font-weight: bold;
font-size: 1.5rem;
}
.columns-2{
flex-basis: 50%;
}
.button-faq, .button-price{
font-size: 1.7rem;
width: 90%;
}
.button-column{
font-size: 1.5rem;
}
.flow-table td{
vertical-align: middle;
padding-left: 20px;
}
.flow-title{
font-weight: bold;
font-size: 1.8rem;
}
.fa-caret-down{
font-size: 3rem;
color: #217FC4;
}
.fa-calculator, .fa-question{
font-size: 3rem;
vertical-align: middle;
margin-right: 20px
}
.service-head-p{
font-size: 1.5rem;
}
.sectionLine {
  border-bottom: 1px dotted;
}

/*==============================
	当事務所の特徴
==============================*/
.point-box1{
background-color: #F0F9FD;
}
.point-title{
font-size: 2.3rem;
color: #0051A4;
font-weight: bold;
}
.point-title2{
font-size: 1.8rem;
color: #0051A4;
font-weight: bold;
}

/*==============================
	費用について
==============================*/
.price-table table th{
font-weight: bold;
background-color: #F2F7FC;
  width: 50%;
}
#price-sozoku,#price-kaisya,#price-fudosan,#price-kazoku,#price-hozin,#price-other{
    margin-top: -130px;
    padding-top: 130px;
}

/*==============================
	よくあるご質問
==============================*/
.faq-cat li{
float: left;
}
.faq-cat li a{
display: inline-block;
font-size: 1.5rem;
font-weight: bold;
color: #0051A4;
margin-right: 15px;
margin-top: 10px;
border: 1px solid #0051A4;
border-radius: 5px;
padding: 5px 10px;
}
.faq-cat li a:hover{
color: #FFF;
background-color: #0051A4;
text-decoration: none;
}
.question{
color: #0051A4;
font-weight: bold;
padding-left: 2.3em;
text-indent: -2.3em;
font-size: 1.6rem;
}
.question::before{
content: "Q.";
margin-right: 10px;
font-size: 2.5rem;
}
.answer::before{
content: "A.";
margin-right: 10px;
font-size: 2.5rem;
color: #41B7C9!important;
font-weight: bold;
}
.answer{
padding-left: 2.5em;
text-indent: -2.5em;
border-bottom: 1px dotted #979797;
margin-bottom: 10px;
padding-bottom: 10px;
}
.title8 .fa-dot-circle{
color: #FFFFFF!important;
}
#link01, #link02, #link03, #link04, #link05{
    margin-top: -130px;
    padding-top: 130px;
}
/*==============================
	司法書士紹介
==============================*/
.staff-name{
font-size: 2.3rem;
background-color: #0051A4;
padding: 5px 15px;
color: #FFFFFF;
border-radius: 5px;
line-height: 1.2em;
}
.staff-name-sm{
font-size: 1.5rem;
}

@media screen and (min-width: 768px) {
.staff th{
width: 15%;
font-weight: bold;
}
}
@media screen and (max-width: 767px) {
.staff th{
width: 25%;
font-weight: bold;
}
}
@media screen and (max-width: 767px) {
.staff img{
width: 50%;
}
}

/*==============================
	事務所案内
==============================*/
@media screen and (min-width: 768px) {
.history th, .profile th{
width: 15%;
font-weight: bold;
}
}
@media screen and (max-width: 767px) {
.history th, .profile th{
width: 25%;
font-weight: bold;
}
}

.access{
background-color: #F8F8F8;
}

/*==============================
	お問合せ・相談予約
==============================*/
.contact-atten{
font-weight: bold;
}
.control-label {
    font-weight: bold;
    font-size: 1.4rem;
}
.required {
    background-color: #C90613;
    padding: 4px 5px;
    margin-left: 2rem;
    color: #FFFFFF;
    font-size: 1.1rem;
}
input[type="submit"] {
    background-color: #1E65C7;
    color: #FFFFFF;
    font-size: 1.8rem;
    padding: 10px;
    border: none;
}

/*==============================
	サイトマップ
==============================*/
.sitemap .roundedbox{
padding: 20px 40px;
border: 1px solid #B3B3B3;
border-radius: 10px;
background-color: #F0F4F7;
margin: 0 50px;
}
.sitemap .roundedbox h4 a{
font-size: 2.3rem;
font-weight: bold;
color: #0051A4;
display: block;
}
.sitemap .roundedbox svg{
margin-right: 10px;
}
.sitemap .roundedbox li{
padding-right: 2rem;
padding-bottom: 0.2rem;
}
.sitemap .roundedbox li a{
font-size: 1.6rem;
}
.sitemap .roundedbox li::before{
font-family: "Font Awesome 5 Free";
font-weight: 900;
content: "\f054";
padding-right: 8px;
color: #01A0E9;
}


/*==============================
	リンク集
==============================*/
.link-list li{
  border-bottom: 1px solid #ccc;
  width: 48%;
}
@media (max-width: 768px){
  .link-list li{
  width: 100%;
}  
}
.link-list li a {
    display: block;
    width: 100%;
    height: 100%;
  padding: 12px 10px;
}
.link-list li a:hover{
  background: #F7F7F7;
  text-decoration: none;
  color: #000;
}