/*----------------------------------
初期化
----------------------------------*/

*,
*::before,
*::after {
	box-sizing: border-box;
}

html,
body {
	position: relative;
	margin: 0;
	padding: 0;
}

html {
	height: 100%;
}

body {
	-webkit-font-smoothing: antialiased;
	-moz-osx-font-smoothing: grayscale;
	background: #fffff9;
	color: #1E1E1E;
	font-weight: 400;
	font-size: 16px;
	font-size: 4.1025641026vw;
	line-height: 1.4375;
	font-family: "Noto Sans JP", sans-serif;
	letter-spacing: 0;
	overflow-wrap: break-word;
}

/*----------------------------------------------------

	基本

----------------------------------------------------*/

img {
	max-width: 100%;
	height: auto;
	border: none;
}

main {
	width: 750px;
	max-width: 100%;
	margin: 0 auto;
	border-right: solid 0.9px #ddd;
	border-left: solid 0.9px #ddd;
	background-color: #eee;
}

.basic-inner {
	width: 750px;
	max-width: 100%;
	margin: 0 auto;
	padding: 0 1rem;
}

.inner {
	width: 750px;
	max-width: 100%;
	margin: 0 auto;
	padding: 0 9px;
}

.inner-2 {
	width: 100%;
	padding: 1rem;
}

h2,
h3,
p {
	margin: 0;
	padding: 0;
}

p {
	font-size: 16px;
	font-size: 4.1025641026vw;
}

p.center {
	text-align: center;
}

table {
	width: 100%;
	border-collapse: collapse;
	table-layout: fixed;
}

a:link {
	color: #0b62e5;
}

a:visited {
	color: #9b34d6;
}

/*----------------------------------------------------

resposive

----------------------------------------------------*/

.pc_area {
	display: block;
}

.sp_area {
	display: none;
}

.pc-img {
	display: block !important;
}

.sp-img {
	display: none !important;
}

/*----------------------------------------------------

ヘッダー

----------------------------------------------------*/

.my-header-content {
	display: flex;
	align-items: center;
	justify-content: center;
	margin: 0 0 0 auto;
}

.my-header-content__button .c-btn {
	margin: 0 1rem 0 0;
}

.contact-button {
	display: flex;
	position: relative;
	align-items: center;
	padding: 0 24px 0 48px;
	border-radius: 100vh;
	background-color: #36aab5;
	font-size: 16px;
}

.contact-button:before {
	position: absolute;
	top: 50%;
	left: 18px;
	width: 22px;
	height: 22px;
	transform: translate(0, -50%);
	background: url(../img/ico/mail_white.svg) no-repeat center center;
	background-size: contain;
	content: "";
}

a.contact-button:visited,
a.contact-button:link,
header li a:visited,
header li a:link {
	color: #fff;
}

p.header-tel-text {
	color: #0652b8;
	font-weight: bold;
	font-size: 0.75rem;
}

.my-header-content__tel {
	margin-right: 20px;
}

h3.top-phone {
	margin-top: -6px;
	color: #0652b8;
	font-size: 1.7rem;
}

header {
	display: flex;
	z-index: 100;
	position: relative;
	top: 0;
	width: 100%;
	height: 88.5px;
}

.header-inner {
	display: flex;
	align-items: center;
	width: 750px;
	margin: 0 auto;
	padding: 0 7px 0 15px;
}

.logo {
	display: block;
	position: relative;
	width: 312px;
	width: 80vw;
	max-width: 600px;
	height: 34px;
	height: 8.7179487179vw;
	max-height: 65.38px;
}

nav {
	margin: 0 0 0 auto;
}

header ul {
	display: flex;
	margin: 0;
	padding: 0;
	list-style: none;
}

header a {
	display: block;
}

.header_nav {
	display: none;
}

#hamburger {
	position: relative;
	width: 68.71px;
	height: 71px;
	margin: 0 0 0 auto;
	border-radius: 3px;
	background: #005FB8;
	cursor: pointer;
}

.icon span:nth-of-type(-n + 3) {
	position: absolute;
	left: 11px;
	width: 46px;
	height: 4px;
	background-color: #fff;
	transition: ease 0.3s;
}

.icon span:nth-of-type(1) {
	top: 14px;
}

.icon span:nth-of-type(2) {
	top: 24px;
}

.icon span:nth-of-type(3) {
	top: 34px;
}

.icon .menu {
	position: absolute;
	bottom: 8px;
	left: 50%;
	transform: translateX(-50%);
	color: #fff;
	font-size: 13px;
	white-space: nowrap;
}

.icon.close span:nth-of-type(1) {
	top: 28px;
	transform: rotate(45deg);
}

.close span:nth-of-type(2) {
	opacity: 0;
}

.icon.close span:nth-of-type(3) {
	top: 28px;
	transform: rotate(-45deg);
}

.header_nav {
	z-index: 10;
	position: absolute;
	top: 88.5px;
	left: 50%;
	width: 100%;
	max-width: 750px;
	transform: translateX(-50%);
	background-color: rgba(34, 49, 52, 0.9);
}

.header_nav ul {
	flex-direction: column;
}

.header_nav ul li a {
	padding: 10px 1em;
	border-top: solid 0.5px rgba(255, 255, 255, 0.6);
	text-align: left;
}

nav.header_nav ul li {
	padding: 0;
}

/**********************************　
以下、ハンバーガーメニューの設定　
************************************/

/*----------------------------------------------------

共通

----------------------------------------------------*/

.section-title {
	padding: 16px 0;
	background-color: #005FB8;
	color: #fff;
	font-weight: 700;
	font-size: 24px;
	font-size: 6.1538461538vw;
	text-align: center;
}

/*----------------------------------------------------

main visual

----------------------------------------------------*/

.main-visual {
	margin-top: -88.5px;
}

/* 画面幅が800px以上のとき */

/*----------------------------------------------------

CTA

----------------------------------------------------*/

.cta {
	padding: 24px 9px;
	background-color: #005FB8;
}

.cta.first {
	position: relative;
	padding: 0 9px 15px;
	background-color: initial;
}

.cta.first::before {
	position: absolute;
	top: 20px;
	left: 0;
	width: 100%;
	height: calc(100% - 20px);
	background-color: #C9E8FF;
	content: "";
}

.cta.first .cta-inner {
	position: relative;
	margin-top: -28px;
}

.cta-inner {
	position: relative;
	padding: 42px 9px 17px;
	background-color: #fff;
	box-shadow: 0 4px 4px rgba(0, 0, 0, 0.25);
}

.cta-inner::before,
.cta-inner::after {
	position: absolute;
	width: 42px;
	width: 10.7692307692vw;
	height: 39.5px;
	height: 10.1282051282vw;
	background: url(../img/triangle.png) no-repeat center left/contain;
	content: "";
}

.cta-inner::before {
	top: 0;
	left: 0;
}

.cta-inner::after {
	right: 0;
	bottom: 0;
	transform: rotate(180deg);
}

.cta-title {
	color: #193753;
	font-weight: 900;
	font-size: 23px;
	font-size: 5.8823529412vw;
	text-align: center;
}

.cta-tel {
	margin-top: 9px;
}

.cta-text {
	margin-top: 3px;
	font-weight: 500;
	font-size: 14px;
	font-size: 3.5897435897vw;
	text-align: center;
}

.cta-line {
	margin-top: 25px;
}

a.text-link {
	display: block;
	margin-top: 16px;
	color: #1E1E1E;
	font-weight: 500;
	font-size: 14px;
	font-size: 3.5897435897vw;
	text-align: center;
	text-decoration: underline;
	text-underline-offset: 2px;
}

/*----------------------------------------------------

返せない借金にお悩みの方へ

----------------------------------------------------*/

#sec01 {
	padding-top: 42px;
}

.bothering-title {
	position: relative;
	margin-top: 14px;
	font-weight: 900;
	font-size: 31px;
	font-size: 7.9487179487vw;
	line-height: 1.483;
	letter-spacing: -0.02em;
	text-align: center;
}

.bothering-title::after {
	position: absolute;
	bottom: -35px;
	bottom: -7vw;
	left: 50%;
	width: 283px;
	width: 72.5641025641vw;
	max-width: 544px;
	height: 20px;
	height: 5.1282051282vw;
	max-height: 38.5px;
	transform: translateX(-50%);
	background: url(../img/line_arrow.png) no-repeat center left/contain;
	content: "";
}

.bothering-title .underline {
	background: linear-gradient(transparent 70%, #FFEE53 50%);
	color: #005FB8;
}

.bothering-lead {
	position: relative;
	margin: 0 9px;
	margin-top: 41px;
	margin-top: 8.2vw;
	padding: 10px 0;
	background-color: #fff;
	font-weight: 900;
	font-size: 31px;
	font-size: 7.9487179487vw;
	line-height: 1.25;
	letter-spacing: -0.02em;
	text-align: center;
}

.bothering-lead .font-large {
	color: #F53333;
	font-size: 57px;
	font-size: 14.6153846154vw;
}

.bothering-content {
	margin-top: -65px;
	padding-top: 83px;
	background-color: #C9E8FF;
}

.bothering-wrap {
	padding: 10px 9px;
	background-color: #fff;
}

.bothering-text + .bothering-text {
	margin-top: 10px;
}

/*----------------------------------------------------

自己破産にかかる費用

----------------------------------------------------*/

#sec02 {
	padding-top: 47px;
}

.cost-inner {
	padding: 28px 22px 12px;
}

.cost-table {
	margin-top: 20px;
}

.cost-table table {
	border: 2px solid #AC8931;
}

.cost-table table th,
.cost-table table td {
	display: block;
	font-weight: 700;
	font-size: 21px;
	font-size: 5.3846153846vw;
	text-align: center;
}

.cost-table table th {
	padding: 4px 0;
	background-color: #AC8931;
	color: #fff;
}

.cost-table table td {
	padding: 13px 0 12px;
	background-color: #fff;
}

.cost-table table td .font-small {
	font-size: 14px;
	font-size: 3.5897435897vw;
}

.cost-caption {
	margin-top: 3px;
	font-size: 11px;
	font-size: 2.8205128205vw;
}

.cost-content {
	margin-top: 19px;
	padding: 11px 10px 12px;
	border: 2px solid #AC8931;
	background-color: #fff;
}

.cost-title {
	color: #AC8931;
	font-weight: 700;
	font-size: 21px;
	font-size: 5.3846153846vw;
	text-align: center;
}

.cost-text {
	margin-top: 8px;
}

/*----------------------------------------------------

自己破産の解決事例

----------------------------------------------------*/

#sec03 {
	padding-top: 53px;
}

#sec03 .inner {
	padding-top: 18px;
}

.case-lists {
	margin-top: 18px;
}

.case-list + .case-list {
	margin-top: 21px;
}

.case-label {
	text-align: center;
}

.case-label .txt {
	padding: 4px 17px;
	border-radius: 10px 10px 0 0;
	background-color: #193753;
	color: #fff;
	font-weight: 700;
	font-size: 18px;
	font-size: 4.6153846154vw;
}

.case-content {
	margin-top: 4px;
	padding: 20px 10px 25px;
	background-color: #fff;
	box-shadow: 0 4px 4px rgba(0, 0, 0, 0.25);
}

.case-content p {
	margin-top: 28px;
	padding: 0 15px;
}

.case-content p + p {
	margin-top: 10px;
}

.case-message {
	margin-top: 24px;
	padding: 8px 3px 0 10px;
	background-color: #C9E8FF;
}

.case-message-title {
	color: #193753;
	font-weight: 900;
	font-size: 21px;
	font-size: 5.3846153846vw;
	line-height: 1.428;
	letter-spacing: -0.03em;
	text-align: center;
}

.case-message-wrap {
	display: flex;
	align-items: flex-end;
	margin-top: 12px;
}

.case-message-wrap p {
	padding-bottom: 9px;
}

.case-message-img {
	flex: 0 0 35.9%;
	margin-left: 9px;
}

/*----------------------------------------------------

自己破産によくある勘違い

----------------------------------------------------*/

#sec04 {
	padding: 43px 0 18px;
}

#sec04 .inner {
	padding-top: 18px;
}

#sec04 .inner > p {
	padding: 0 10px;
}

.misunderstanding-items {
	margin-top: 22px;
}

.misunderstanding-item {
	padding: 10px 10px 17px;
	background-color: #fff;
	box-shadow: 0 4px 4px rgba(0, 0, 0, 0.25);
}

.misunderstanding-item + .misunderstanding-item {
	margin-top: 18px;
}

.misunderstanding-img {
	padding: 0 2px 0 10px;
}

.misunderstanding-content {
	padding: 12px 19px 7px;
	background-color: #E8F5FF;
}

.misunderstanding-content p + p {
	margin-top: 10px;
}

/*----------------------------------------------------

事務所・弁護士のご紹介

----------------------------------------------------*/

#sec05 {
	padding-top: 47px;
}

.sec05-wrapper {
	margin-top: 30px;
}

.sec05-wrapper + .sec05-wrapper {
	margin-top: 48px;
}

.sec05-title {
	font-weight: 700;
	font-size: 24px;
	font-size: 6.1538461538vw;
	text-align: center;
}

.office-img {
	margin-top: 23px;
}

.office-table {
	margin-top: 23px;
}

.office-table table {
	border: 0.5px solid #26456A;
}

.office-table table tr {
	border-bottom: 0.5px solid #26456A;
}

.office-table table tr:last-child {
	border-bottom: none;
}

.office-table table th {
	width: 21.891%;
	padding: 18px 0;
	background-color: #B7CBD9;
	font-weight: 500;
	vertical-align: middle;
}

.office-table table td {
	padding: 14px 5px 14px 19px;
	background-color: #fff;
}

.office-table table td .location + .location {
	margin-top: 10px;
}

.office-table table td a {
	color: #0500FF;
	text-decoration: underline;
	text-underline-offset: 2px;
}

.lawyer-lists {
	margin-top: 23px;
}

.lawyer-list {
	padding: 22px 20px 12px 13px;
	background-color: #fff;
	box-shadow: 2px 4px 4px rgba(0, 0, 0, 0.25);
}

.lawyer-list + .lawyer-list {
	margin-top: 20px;
}

.lawyer-wrap {
	display: flex;
	align-items: center;
}

.lawyer-img {
	flex: 0 0 35.608%;
}

.lawyer-content {
	margin-left: 26px;
	font-weight: 500;
}

.lawyer-content .name {
	margin-top: 7px;
}

.lawyer-content .affiliation {
	font-size: 12px;
	font-size: 3.0769230769vw;
}

.lawyer-table {
	margin-top: 13px;
}

.lawyer-table table {
	border: 1px solid #B3B3B3;
}

.lawyer-table table th,
.lawyer-table table td {
	padding: 3.5px 0;
	border: 1px solid #B3B3B3;
	font-size: 14px;
	font-size: 3.5897435897vw;
}

.lawyer-table table th {
	width: 28.783%;
	padding-left: 13.5px;
	background-color: #FFE7DB;
}

.lawyer-table table td {
	padding-left: 13.5px;
}

/*----------------------------------------------------

ご相談から解決までの流れ

----------------------------------------------------*/

#sec06 {
	padding-top: 48px;
}

.flow {
	width: 327px;
	width: 83.8461538462vw;
	max-width: 628px;
	margin: 26px auto 0;
}

.flow-wrap {
	position: relative;
}

.flow-wrap::after {
	position: absolute;
	top: 16px;
	left: 11px;
	width: 30px;
	width: 7.6923076923vw;
	height: calc(100% - 20px);
	background: url(../img/arrow.png) no-repeat center left/contain;
	content: "";
}

.flow-wrap + .flow-list .flow-title {
	background-color: #005FB8;
	color: #fff;
}

.flow-wrap + .flow-list .flow-title .step {
	background-color: #fff;
	color: #005FB8;
}

.flow-list {
	padding-bottom: 40px;
}

.flow-list p {
	margin: 9px 0 0 45px;
}

.flow-list p .color-red {
	color: #F53333;
	font-weight: 700;
}

.flow-list .font-small {
	display: block;
	margin-top: -7px;
	font-size: 11px;
	font-size: 2.8205128205vw;
}

.flow-title {
	display: flex;
	z-index: 1;
	position: relative;
	align-items: center;
	padding: 10px 5px 10px 9px;
	border: 2px solid #005FB8;
	background-color: #fff;
	color: #005FB8;
	font-weight: 500;
	font-size: 18px;
	font-size: 4.6153846154vw;
}

.flow-title .step {
	display: inline-block;
	margin-right: 14px;
	padding: 1px 4px 2px;
	background-color: #005FB8;
	color: #fff;
	font-size: 13px;
	font-size: 3.3333333333vw;
}

.flow-title .number {
	display: inline-block;
	margin-left: 2px;
}

/*----------------------------------------------------

footer

----------------------------------------------------*/

#footer {
	width: 750px;
	max-width: 100%;
	margin: auto;
	padding-bottom: 24.1025641026vw;
	text-align: center;
}

footer p {
	padding: 5.5px 0;
	background-color: #7DC7EF;
	font-weight: 500;
	font-size: 14px;
	font-size: 3.5897435897vw;
}

.footer-contact {
	display: none;
	z-index: 10;
	position: fixed;
	bottom: 0;
	left: 50%;
	width: 750px;
	max-width: 100%;
	height: 94px;
	height: 24.1025641026vw;
	padding: 10px 7px;
	transform: translateX(-50%);
	background-color: #fff;
	box-shadow: 0 -2px 4px 0 rgba(0, 0, 0, 0.25);
}

.footer-contact.fixed {
	display: block;
}

.footer-contact ul {
	display: flex;
	margin-top: 5px;
}

.footer-contact ul li {
	width: calc(50% - 5.5px);
}

.footer-contact ul li.mail {
	margin-left: 11px;
}

.footer-contact-text {
	color: #193753;
	font-weight: 500;
	letter-spacing: -0.02em;
	text-align: center;
}

/*----------------------------------------------------

Contact page

----------------------------------------------------*/

body.contact-page {
	background-color: #fff;
}

body.contact-page .header-inner {
	width: 960px;
}

body.contact-page .header_nav {
	max-width: 960px;
}

body.contact-page .description {
	margin: 40px 0;
	font-size: 1.1pc;
}

body.contact-page .home_links a {
	color: #0005FF;
}

body.contact-page .home_links,
body.contact-page input[type=submit] {
	font-size: 1.1pc;
}

body.contact-page form .green-button {
	border: 1px solid #005FB8;
	background: #fff;
	color: #005FB8;
}

body.contact-page form .green-button:hover {
	background-color: #005FB8 !important;
	color: #fff;
}

body.contact-page #footer {
	width: 100%;
	padding: 10px 0;
	background-color: #005FB8;
}

body.contact-page #footer p {
	background-color: initial;
	font-size: 14px;
}

.mfp input,
.mfp textarea {
	max-width: 100%;
	padding: 10px 8px;
	box-shadow: none;
}

form#mailformpro dl dt {
	padding-top: 31px;
}

.mfp_buttons button#mfp_button_send {
	background: #005FB8;
}

.mfp_buttons button:hover {
	opacity: 1;
}

.mfp_element_submit {
	text-shadow: none;
}

.mfp_element_submit:hover {
	box-shadow: none;
}

.mfp_element_button,
#mfp_button_cancel {
	text-shadow: none;
	transition: all 0.3s ease 0s;
}

.mfp_element_button:hover {
	background-color: #005FB8 !important;
	opacity: 0.7 !important;
}

#mfp_button_cancel:hover {
	background-color: #ccc !important;
	opacity: 0.7 !important;
}

body.thanks-page {
	display: flex;
	flex-direction: column;
	min-height: 100%;
	margin-top: 0;
}

body.thanks-page .content {
	flex: 1;
}

.thanks-contents .txt {
	margin: 20px 0;
}

.thanks-contents button.back {
	background: initial;
}

.thanks-contents button.back a {
	color: #0500FF;
}

.thanks-page h2 {
	color: #fff;
	font-size: 7vw;
}

@media (min-width: 751px) {

body {
	font-size: 30.7px;
}

p {
	font-size: 30.7px;
}

.section-title {
	font-size: 46px;
}

.cta-inner::before,
.cta-inner::after {
	width: 80.77px;
	height: 75.96px;
}

.cta-title {
	font-size: 44px;
}

.cta-text {
	font-size: 27px;
}

a.text-link {
	font-size: 27px;
}

.bothering-title {
	font-size: 59.6px;
}

.bothering-title::after {
	bottom: -52px;
}

.bothering-lead {
	margin-top: 63px;
	font-size: 59.6px;
}

.bothering-lead .font-large {
	font-size: 109.6px;
}

.cost-table table th,
.cost-table table td {
	font-size: 40.4px;
}

.cost-table table td .font-small {
	font-size: 27px;
}

.cost-caption {
	font-size: 21px;
}

.cost-title {
	font-size: 40.4px;
}

.case-label .txt {
	font-size: 34.6px;
}

.case-message-title {
	font-size: 40.4px;
}

.sec05-title {
	font-size: 46px;
}

.lawyer-content .affiliation {
	font-size: 23px;
}

.lawyer-table table th,
.lawyer-table table td {
	font-size: 27px;
}

.flow-list .font-small {
	font-size: 21px;
}

.flow-title {
	font-size: 34.6px;
}

.flow-title .step {
	font-size: 25px;
}

#footer {
	padding-bottom: 158px;
}

footer p {
	font-size: 27px;
}

.footer-contact {
	height: 158px;
}

.thanks-page h2 {
	font-size: 52.5px;
}

}

@media (max-width: 799px) {

form#mailformpro dl dt {
	padding-bottom: 7px;
}

}

@media (max-width: 499px) {

main {
	border-right: none;
	border-left: none;
}

header {
	height: 46px;
	height: 11.7948717949vw;
}

.header-inner {
	padding-left: 11px;
}

#hamburger {
	width: 35.73px;
	height: 37px;
}

.icon span:nth-of-type(-n + 3) {
	left: 7px;
	width: 22.8px;
	height: 2.5px;
}

.icon span:nth-of-type(1) {
	top: 7px;
}

.icon span:nth-of-type(2) {
	top: 13px;
}

.icon span:nth-of-type(3) {
	top: 19px;
}

.icon .menu {
	bottom: 3px;
	font-size: 7px;
}

.icon.close span:nth-of-type(1) {
	top: 14px;
}

.icon.close span:nth-of-type(3) {
	top: 14px;
}

.header_nav {
	top: 11.7948717949vw;
}

.main-visual {
	margin-top: -11.7948717949vw;
}

.bothering-title::after {
	bottom: -35px;
}

.bothering-lead {
	margin-top: 41px;
}

.office-table table {
	border-width: 1px;
}

.office-table table tr {
	border-width: 1px;
}

body.contact-page #footer p {
	font-size: 13px;
}

}