@charset "utf-8";
/* CSS Document */

/* ===================================================================
 Reset
=================================================================== */

*, *:before, *:after { -moz-box-sizing: border-box; -webkit-box-sizing: border-box; box-sizing: border-box; }
html, body, h1, h2, h3, h4, h5, h6, ul, ol, dl, li, dt, dd, p, div, span, img, a, table, tr, th, td {
 margin: 0; padding: 0; border: 0; font-weight: normal; font-size: 100%; vertical-align:baseline; -webkit-box-sizing: border-box; -moz-box-sizing: border-box; box-sizing: border-box; }
article, header, footer, aside, figure, figcaption, nav, section { display:block; }
figure {padding: 0; margin: 0 0 1em 0;}
html { scroll-behavior:smooth; }
body { -ms-text-size-adjust: 100%; -webkit-text-size-adjust: 100%; }
table { border-collapse: collapse; border-spacing: 0;}


/* Layout
=================================================================== */
html { -webkit-box-sizing:border-box; -moz-box-sizing:border-box; box-sizing:border-box;}
*, :before, :after { -webkit-box-sizing:inherit; -moz-box-sizing:inherit; box-sizing:inherit;}

@font-face { font-family: "Yu Gothic M"; src: local("Yu Gothic Medium");}
@font-face { font-family: "Yu Gothic M"; src: local("Yu Gothic Bold"); font-weight: bold;}

body { padding:0; margin:0 auto; font-family: "游明朝", YuMincho, "ヒラギノ明朝 ProN W3", "Hiragino Mincho ProN", "HG明朝E", "ＭＳ Ｐ明朝", "ＭＳ 明朝", serif; color: #000; font-size:16px; line-height:1.75; letter-spacing: 0.08em;}

/* Chrome でのみフォントを太めに表示する */
@media screen and (-webkit-min-device-pixel-ratio: 0) {
  * { text-shadow: transparent 0 0 0, rgba(0, 0, 0, .7) 0 0 0 !important;}
}

@media only screen and (min-width: 960px) { 
    .tel { pointer-events:none}
}

p { margin:0 0 1em; padding:0; }
img { max-width:100%; height: auto; margin:0; padding:0; -ms-interpolation-mode: bicubic; border: 0; vertical-align: middle;}

ul,ol { list-style-type:none;}

.bg-g { background: #F5F7F8;}

.alignleft { display:inline; float:left; margin-right:1.5em;}
.alignright { display:inline; float:right; margin-left:1.5em;}
.aligncenter { clear:both; display:block; margin-left:auto; margin-right:auto; text-align: center;}

.clear { clear: both;}
.clear:after { content:" "; display:block; clear:both;}

a.btn { width: 320px; max-width: 90%; margin: 0 auto; padding: 20px 0 19px 0; font-size: 18px; font-weight: bold; background: #555; color: #FFF; text-align: center; line-height: 1; display: block; text-decoration: none;}
a.btn:before { font-family: "Font Awesome 5 Free"; content: "\f0a9"; font-weight: 900; padding-right : 5px; color: #fff;}

a,
a:visited { text-decoration: none; -webkit-transition: 0.3s; transition: 0.3s;}
a:focus { }
a:hover,
a:active { opacity:0.7; filter: alpha(opacity=70);}

/* ===================================================================
 Header
=================================================================== */
#site-head { position:fixed; top: 0; width: 100%; height:60px; padding:0; background:#ADB8BB; text-align: center; z-index: 99999;}
#head-area {}
h1 { font-size: 22px; font-weight: bold; }
h1 a { color: #000;}

@media screen and (min-width:960px){
    #site-head { position:fixed; width: 260px; height:100%; padding:50px 0 0 0; background:#ADB8BB; text-align: center;}
    h1 { position: relative; display: inline-block; }
    h1:before { content: ''; position: absolute; bottom: -17px; display: inline-block; width: 65px; height: 2px; left: 50%; -webkit-transform: translateX(-50%); transform: translateX(-50%); background-color: #003040;}
}

@media only screen and (max-width:959px) {
    h1 { float: left; padding: 10px;}
}

/*--------------------------------------------------------------
 NAVI
--------------------------------------------------------------*/
#head-nav { clear: both; width:100%; padding:0;}
#head-nav:after { content:" "; display:block; clear:both;}

@media only screen and (min-width:960px) {
    #head-nav { clear: both; width:100%; margin:70px auto 60px auto; padding:0;}
    #head-nav:after { content:" "; display:block; clear:both;}
}

@media only screen and (max-width:959px) {
	#head-nav { position: absolute; width:220px; right:0; top:0;}
}

#head-mn { width:12em; margin:0 auto; padding:0; }
#head-mn ul { list-style-type:none;}
#head-mn ul li {position: relative; margin-bottom: 2em;}
#head-mn ul li a { font-size:17px; color:#000; text-decoration:none; display: block;}

@media screen and (min-width:960px){
    #head-mn ul li a:hover { opacity:1; filter: alpha(opacity=100);}
    #head-mn ul li a::after { position:absolute; bottom:0; left:0; content: ''; width:100%; height:2px; background:#FFF; transform:scale(0, 1); transform-origin:center top; transition:transform .3s;}
    #head-mn ul li a:hover::after { transform:scale(1, 1);}
}

@media screen and (max-width:959px){
    #head-mn ul { width: 100%; margin:0 auto; padding:30px 0;}
    #head-mn ul li { width: 100%; margin-bottom:0; }
    #head-mn ul li:first-child { border-top: 1px solid #AAA;}
    #head-mn ul li a{ display:block; margin:0 auto; padding: 1em 0; font-size:15px; border-bottom: 1px solid #AAA; color: #fff; text-decoration: none; text-align: center;}
    #head-mn ul li a:hover { color: #fff; opacity:0.7; filter: alpha(opacity=70); }
}

#head-info { font-size: 14px;}
#head-info a.tel {color: #000;}

@media screen and (max-width:959px){
    #head-info { padding-top: 16px;}
    .head-add {display: none;}
}

#head-info .head-tel a{ width: 170px; padding:13px 0 0 0; font-size: 17px; color: #222; border-left: 1px solid #aaa;}

@media screen and (min-width:641px){
    #head-info .head-tel i {display: none;}
}

@media screen and (max-width:640px){
    #head-info .head-tel{ position: absolute; top: 15px; right: 60px;}
    #head-info .head-tel span{display: none;}
    #head-info .head-tel i{ height: 40px; width: 40px; margin: 0; padding: 0; font-size: 26px;}
}

/* NAVI SP
--------------------------------------------------------------*/
.menu-trigger { display:none;}

@media (max-width: 959px) {
    .menu-trigger { position: relative; right: 15px; top: 13px; float: right; width:28px; height:38px; margin-top:0; margin-right:0; display: block; vertical-align: middle; cursor: pointer; z-index: 999999;}
    .menu-trigger span { width: 100%; height: 2px; display:inline-block; position: absolute; left: 0; background:#000; transition: all .5s .2s;}
    .menu-trigger.active span { background-color: #000;}
    .menu-trigger span:nth-of-type(1) {	top: 0;}
    .menu-trigger.active span:nth-of-type(1) { transform: translateY(10px) rotate(-45deg);}
    .menu-trigger span:nth-of-type(2) {	top: 10px;}
    .menu-trigger.active span:nth-of-type(2) {opacity: 0;}
    .menu-trigger span:nth-of-type(3) {	top: 20px;}
    .menu-trigger.active span:nth-of-type(3) { transform: translateY(-10px) rotate(45deg);}
    .menu-trigger span.sp-text,
	.menu-trigger.active span.sp-close { width:50px; height:auto; margin-left:-10px; top:25px; left:-1px; color: #000; text-align:center; font-size:11px; background: none!important;}
	.menu-trigger span.sp-close { display: none;}
	.menu-trigger.active span.sp-text { display: none;}
	.menu-trigger.active span.sp-close { display: block;}

    .menu-content { width:100%; padding:0; display: none; position: absolute; top:60px; right: 0; background:#333; z-index:9999;}
    
    .navbar { clear: both; float: none; width:100%; margin-top:0; position: relative;}
    .navbar:before, .navbar:after { display: none;}
    .navbar ul { clear: both; float: none; width: 100%;}
    .navbar li,
    .navbar li:last-child { position: relative; margin: 0; padding: 0;}
}

/* ===================================================================
 main
=================================================================== */
#main { width: 100%; padding: 0 0 80px 0;}
#main section { width: 90%; max-width: 960px; margin: 0 auto; padding:80px 0; text-align: center;}

@media screen and (min-width:960px){
    #main { width:calc(100% - 260px); margin:0 0 0 260px; }
}

@media screen and (max-width:1400px){
    #main section { padding:60px 0;}
}

@media screen and (max-width:640px){
    #main section { padding:40px 0;}
}

#contents { }

#mv { position: relative; }
#mv .mv-cut {position: absolute; left: 0; top: 0; z-index: 1;}
#mv #slide{ position: absolute; width: 100%; height:100%; top: 0; right: 0; overflow: hidden; z-index: 0;}

#mv #slide .slide-item { width:100%; z-index: 0; }
#mv #slide .slick-slide { margin: 0; transition: all ease-in-out .3s; opacity: 1; }

@media screen and (min-width:1401px){ 
    #mv { height:720px;}
    #mv #slide { width: calc(100% - 420px); }
    #mv #slide .slide-item img { width:100%; height:100%; object-fit: cover; }
}

@media screen and (min-width:960px) and (max-width:1400px){ 
    #mv { height:570px;}
    #mv .mv-cut {height:570px;}
    #mv #slide { width: calc(100% - 332px); height:570px; }
    #mv #slide .slide-item img { height:570px;}
}

@media screen and (min-width:640px) and (max-width:959px){ 
    #mv { height:500px; margin-top: 60px;}
    #mv .mv-cut {height:500px;}
    #mv #slide { width: calc(100% - 200px); height:500px;}
    #mv #slide .slide-item img { height:500px;}
}

@media screen and (max-width:639px){ 
    #mv { height:300px; margin-top: 60px;}
    #mv .mv-cut {height:300px;}
    #mv #slide { width: calc(100% - 137px); height:300px;}
    #mv #slide .slide-item img { height:300px;}
}

@media screen and (max-width:480px){ 
    #mv { height:280px; }
    #mv .mv-cut {display: none;}
    #mv #slide { width:100%; height:280px;}
    #mv #slide .slide-item img { height:280px;}
}

#title {width: 100%; }

@media screen and (max-width:959px){ 
    #title { margin-top: 60px;}
}

#service h3,
#lawyer h3,
#office h3{ font-size: 23px; position: relative; display: inline-block; margin-bottom: 2em; text-align: center; letter-spacing: 0.1em;}
#service h3:after,
#lawyer h3:after,
#office h3:after{ content: '／／／／／'; position: absolute; bottom: -20px; display: inline-block; font-size: 10px; font-weight: bold; left:0; right: 0; color:#00303F; letter-spacing: -0.1em; font-family: "Helvetica Neue", Arial, "Hiragino Kaku Gothic ProN", "Hiragino Sans", Meiryo, sans-serif; font-weight: 500;}

#catch p { text-align: center;}
#catch .note { color: #003040; font-size: 15px; position: relative; display: inline-block; margin-top: 33px; padding-left:1em; text-indent:-1em; text-align: left;}
#catch .note:before { content: ''; position: absolute; top: -20px; display: inline-block; width: 200px; height: 1px; left: 50%; -webkit-transform: translateX(-50%); transform: translateX(-50%); border-bottom: 1px dashed #ADB8BB;}

@media screen and (max-width:1399px){ 
    #catch p br { display: none;}
}

#news h3 { font-size: 23px; position: relative; display: inline-block; margin-bottom: 2em; text-align: center;}
#news h3:before { content: ''; position: absolute; bottom: -10px; display: inline-block; width:40px; height:2px; right:50%; background-color:#4F8496;}
#news h3:after { content: ''; position: absolute; bottom: -10px; display: inline-block; width:40px; height:2px; left:50%; background-color:#033242;}
#news dl { clear:both; width:100%; text-align:left;}
#news dl dt { padding:14px 0 7px 0; clear:left; float:left; width:10em; }
#news dl dd { padding:14px 0 7px 0; margin-left:10em; }
#news dl:after,#news dl dt:after,#news dl dd:after { content:" "; display:block; clear:both;}

@media only screen and (max-width: 640px) {
	#news dl dt { clear: both; float: none; width: 100%; padding-bottom: 5px;}
	#news dl dd { margin-left:0; border-top:none;}
}

#service .box { background: #EDF3F5; padding: 80px 5px;}

#service .box li { display:table; line-height:2; flex-grow:1; position:relative; list-style-type:none; color:#000; flex-grow:1; text-align:center;}
#service .box li + li { border-left:1px solid #A6C1CA;}
#service .box li p { display:table-cell; vertical-align:middle; font-size:19px; color:#000; text-align:center; text-decoration:none; }
#service .box li p.line2 { line-height:1.2;}
#service .box li p span { font-size:15px; }


@media only screen and (min-width: 960px) {
    #service .box ul{ display:-webkit-flex; display:flex; -webkit-flex-wrap:wrap; flex-wrap:wrap; -webkit-box-pack:justify; justify-content:space-between; align-items:center;}
}

@media only screen and (max-width: 959px) {
    #service .box { padding: 10px 5px;}
    #service .box li + li { border-top:1px solid #A6C1CA; border-left: none;}
    #service .box li { width: 18em; margin-left: auto; margin-right: auto; padding: 10px 0;}
}

#lawyer dl { clear:both; width:100%; text-align:left; background: #fff; padding: 50px; margin-bottom: 30px;}
#lawyer dl dt { padding:0; font-size: 17px; color: #004C66;}
#lawyer dl dt h4 {font-size: 21px; color: #000; border-bottom: 3px solid #A6C1CA;}
#lawyer dl dd { padding:20px 0 0 0; }
#lawyer dl:after,#lawyer dl dt:after,#lawyer dl dd:after { content:" "; display:block; clear:both;}

@media only screen and (min-width: 641px) {
    #lawyer dl dt { clear:left; float:left; width:57%; padding-right: 40px;}
    #lawyer dl dd { margin-left:57%; border-left:1px solid #A6C1CA; padding-left:30px; }
}

#office {}
#office dl { clear:both; width:100%; margin-bottom: 60px; text-align:left; border-bottom:1px solid #AAA; line-height: 1.2;}
#office dl dt { padding:1.5em 0 0.7em 3%; clear:left; float:left; width:10em; border-top:1px solid #AAA; font-size: 17px; color:#004C66;}
#office dl dd { padding:1.5em 0 0.7em 3%; margin-left:10em; border-top:1px solid #AAA; font-size: 17px;}
#office dl:after,#office dl dt:after,#office dl dd:after { content:" "; display:block; clear:both;}

@media only screen and (max-width: 640px) {
	#office dl dt { clear: both; float: none; width: 100%; padding:0.7em 0 0.3em 3%;}
	#office dl dd { margin-left:0; border-top:none; padding:0.2em 0 0.7em 3%;}
}

#office .photo { width:100%; margin-bottom: 50px; display:-webkit-flex; display:flex; -webkit-flex-wrap:wrap; flex-wrap:wrap; -webkit-box-pack:justify; justify-content:space-between; align-items:center;}
#office .photo img { max-width:48%;}
#office .access {text-align: left; margin-bottom: 50px;} 
.map{ position:relative; width:100%; height:600px; text-align: center;}
.map iframe { position:absolute; top:0; left:0; width:100%; height: 100%;}

@media only screen and (max-width:640px) {
    .map{ height: 400px; margin: 0 auto;}
}

#contact { background: #EDF3F5; width: 90%; max-width: 960px; margin: 0 auto; padding:60px 30px 30px 30px; text-align: center;}
#contact h3 { font-size: 23px; position: relative; display: inline-block; margin-bottom: 2em; text-align: center;}
#contact h3:before { content: ''; position: absolute; bottom: -10px; display: inline-block; width:40px; height:2px; right:50%; background-color:#4F8496;}
#contact h3:after { content: ''; position: absolute; bottom: -10px; display: inline-block; width:40px; height:2px; left:50%; background-color:#033242;}
#contact a.tel { color: #004C66; font-size: 35px;}
#contact a.tel:before { font-size: 30px; font-family: "Font Awesome 6 Free"; content: "\f879"; font-weight: 900; padding-right:10px; color:#4F8496; vertical-align: top;}
#contact p.open {font-size: 17px;}

#privacy { margin-bottom: 60px;}
#privacy:after { content:" "; display:block; clear:both;}
#privacy h3 { font-size: 23px; position: relative; display: inline-block; margin-bottom: 2em; text-align: center;}
#privacy h3:before { content: ''; position: absolute; bottom: -10px; display: inline-block; width:40px; height:2px; right:50%; background-color:#4F8496;}
#privacy h3:after { content: ''; position: absolute; bottom: -10px; display: inline-block; width:40px; height:2px; left:50%; background-color:#033242;}
#privacy h4 { margin:1.5em 0 1em 0; text-align: left; font-size: 17px; font-weight: bold; border-bottom: 1px solid #A6C1CA;}
#privacy p {text-align: left; margin-left: 1.5em; margin-bottom: 0.5em;}
#privacy ul,
#privacy ol { margin-left: 2em; margin-bottom: 0.5em; padding-left: 1.5em;}
#privacy ol li { list-style: decimal;}
#privacy li {text-align: left;}
#privacy ol.paren { list-style: none; counter-reset: number; margin-left: 0.5em;}
#privacy ol.paren li { position: relative; padding-left: 2.5em; list-style: none;}
#privacy ol.paren li::before { counter-increment: number; content: '（' counter(number) '）'; position: absolute; left: 0;}
#privacy .sign { float: right; max-width: 24em; text-align: left; padding-top:30px;}

@media only screen and (max-width:640px) {
    #privacy p { margin-left:0.5em;}
    #privacy ul,
    #privacy ol { margin-left: 1em;} 
    #privacy .sign { font-size: 92%;}
}

/* ===================================================================
 FOOTER
=================================================================== */
#site-foot { clear: both; text-align: center; background: #F0F3F4; width:100%; margin:0; padding:35px 0 25px 0;}
#site-foot:after { content:" "; display:block; clear:both;}

@media only screen and (min-width:960px) {
    #site-foot {width:calc(100% - 260px); margin:0 0 0 260px; }
}

/* copyright */
.copyright { clear: both; width:100%; text-align:center; font-size:13px; color: #000;}
.copyright a { color:#000; text-decoration:none;}
.copyright a:hover { color:#000; text-decoration:underline;}

/* ページ先頭へ -----------------*/
#pagetop { position:fixed; bottom:6px; right:6px;}
#pagetop a { border:1px solid #555; background-color:rgba(255,255,255,0.7); width:50px; height:50px; line-height: 45px; text-align:center; display:block; font-size:25px; color:#555; text-decoration:none;}
#pagetop a:hover { text-decoration:none; color:#555; border:1px solid #555;}