@charset "utf-8";

/*===============================================
労働問題　CSS
===============================================*/

/* CSS Document */
/*===============================================
ロゴの赤　#cf000e

debt　/　債務整理　/　#704b3f
divorce　/　離婚問題　/　#eb4767
accident　/　交通事故　/　#409cc5
hepatitisb　/　B型肝炎　/　#7aaf40
criminal　/　刑事事件　/　#94000c
work　/　労働問題 残業代請求　/　#5269aa
g_dismissal　/　不当解雇・退職勧奨　/　#5269aa
disaster　/　労働災害　/　#5269aa
g_other_work　/　労働条件・ハラスメント　/　#5269aa
claim　/　債権回収　/　#14385e
bequest　/　遺産相続　/　#e65c00
legalprotect / 個人向け 顧問弁護士　/　#1c4e48

legalprotect / 法人 顧問弁護士　/　#1c4e48
realestate　/　不動産建物明渡し　/　#a16600
civil　/　民事再生・法人破産　/　#149393
china　/　中国進出支援　/　#e02000
overseas　/　海外進出支援　/　#818181
===============================================*/

/*==================================================
お悩みから選ぶ 分野ページのetcボタン
==================================================*/
.etc_area ul {
	margin: 30px 0 0 0;
}
.etc_area li {
	margin: 1px;
	width: calc(25% - 2px);
}
.etc_area li.item01 a p:before { content: url(/common_api/branch/img/individual/work/etc_icon01.svg); }
.etc_area li.item01 a:hover p:before { content: url(/common_api/branch/img/individual/work/etc_icon01_on.svg); }
.etc_area li.item02 a p:before { content: url(/common_api/branch/img/individual/work/etc_icon02.svg); }
.etc_area li.item02 a:hover p:before { content: url(/common_api/branch/img/individual/work/etc_icon02_on.svg); }
.etc_area li.item03 a p:before { content: url(/common_api/branch/img/individual/work/etc_icon03.svg); }
.etc_area li.item03 a:hover p:before { content: url(/common_api/branch/img/individual/work/etc_icon03_on.svg); }
.etc_area li.item04 a p:before { content: url(/common_api/branch/img/individual/work/etc_icon04.svg); }
.etc_area li.item04 a:hover p:before { content: url(/common_api/branch/img/individual/work/etc_icon04_on.svg); }

.etc_area li.item04 a:after {right: 6px;}
/* 1行になったのでコメントアウト　2017/10/23
.etc_area li.item04 a p {
	padding: 56px 0 0 0;
	font-size: 1rem;
	line-height: 1.8;
	letter-spacing: -0.1rem;
}
*/
.etc_area li.item04 a { 
	padding: 10px 8px 10px 0px;
}


/*==================================================
不当解雇かも？と思ったら
==================================================*/
.think_area .think_bnr {
	margin-bottom: 3rem;
}
.think_area .think_bnr li {
	border: 1px solid #c3c3c3;
	display: inline-block;
	padding: 4px;
	position: relative;
	width: 48%;
}
.think_area .think_bnr li::after {
	border-bottom: 6px solid transparent;
	border-left: 6px solid #5269aa;
	border-top: 6px solid transparent;
	content: "";
	height: 0;
	margin-top: -0.34rem;
	position: absolute;
	right: 1rem;
	top: 50%;
	width: 0;
}
.think_area .think_bnr li a {
	color: #5269aa;
	display: flex;
	justify-content: flex-start;
	align-items: center;
}
.think_area .think_bnr li:hover {
	border: 1px solid #5269aa;
	color: #5269aa;
}
.think_area .think_bnr li img {
	margin-right: 4%;
	max-width: 115px;
	vertical-align: middle;
	width: 40%;
}
.think_area .think_bnr li:first-child {
	margin-right: 3%;
}
.think_area .bnrs {
	margin: 2rem 0 0 0;
}
.think_area .bnrs li {
	display: inline-block;
	width: 49%;
}
.think_area .bnrs li img {
	max-width: 380px;
	border: 1px solid #5269AA;
}
.think_area .bnrs li img:hover {
	opacity: 0.6;
}
.think_area .bnrs li:first-child {
	margin-right: 2%;
}
.think_area .btn,
.right_btn {
	float: right;
}
.think_situation img {
	float: left;
	margin-right: 4%;
	width: 48%;
	max-width: 340px;
}
.think_situation h3 {
	margin: 0 0 1rem;
}
.think_situation .check {
	float: left;
	width: 49%;
}
.think_situation li {
	display: block;
	margin-bottom: 0.6rem;
	padding-left: 1.7em;
	line-height: 1.4;
}
.think_situation li::before {
	content: url(/common_api/branch/img/individual/work/icon_check.png);
	display: block;
	float: left;
	margin: 0 0.6em 0 -1.7em;
	text-align: center;
	width: 1em;
}
.think_situation li.p-list__think_situation-last {
	display: block;
	padding-left: 0;
}
.think_situation li.p-list__think_situation-last::before {
	display: none;
}
.think_situation i {
	color: #e00012;
	font-weight: bold;
	font-style: normal;
	margin-top: 0.5rem;
}
/*==================================================
faq
==================================================*/
.faq {
	margin: 60px 0 0 0;
}
.faq dl {
	float: left;
	margin: 0;
	width: 48%;
	display: inline;
}
.faq dl img {
	vertical-align: middle;
}
.faq dl dt {
	margin-bottom: 1rem;
	padding: 10px 0 8px 64px;
	border-bottom: 1px dashed #333333;
	font-size: 1.38rem;
	line-height: 1.2;
}
.faq dl dd {
	position: relative;
	margin-bottom: 0.6rem;
	padding-left: 12px;
	line-height: 1.4;
}
.faq dl dd a:hover {
	color: #5269aa;
}
.faq dl dd:before {
	border-bottom: 6px solid transparent;
	border-left: 6px solid #5269aa;
	border-top: 6px solid transparent;
	content: "";
	height: 0;
	left: 0;
	margin-top: 0.3rem;
	position: absolute;
	top: 0;
	width: 0;
}
.faq .faq01 {
	margin-right: 4%;
}

.faq .faq01 { background: rgba(0, 0, 0, 0) url("/common_api/branch/img/individual/work/faq_icon01.svg") no-repeat scroll 0 0 / 50px auto;}
.faq .faq02 { background: rgba(0, 0, 0, 0) url("/common_api/branch/img/individual/work/faq_icon02.svg") no-repeat scroll 0 0 / 50px auto;}
.faq .faq03 { background: rgba(0, 0, 0, 0) url("/common_api/branch/img/individual/work/faq_icon03.svg") no-repeat scroll 0 0 / 50px auto;}
.faq .faq04 { background: rgba(0, 0, 0, 0) url("/common_api/branch/img/individual/work/faq_icon04.svg") no-repeat scroll 0 0 / 50px auto;}
.faq .faq05 { background: rgba(0, 0, 0, 0) url("/common_api/branch/img/individual/work/faq_icon05.svg") no-repeat scroll 0 0 / 50px auto;}
.faq .faq06 { background: rgba(0, 0, 0, 0) url("/common_api/branch/img/individual/work/faq_icon06.svg") no-repeat scroll 0 0 / 50px auto;}

/* 初回60分無料 */
.first_counselling {
	margin: 60px 0 0 0;
}
.first_counselling img {
	/*margin-bottom: 3rem;*/
	width: 100%;
	max-width: 780px;
}
/*==================================================
cta
==================================================*/
.cta_area {
	margin: 60px 0 0 0;
	padding: 0;
	position: relative;
}
.cta_img {
	margin: 0;
	position: relative;
}
.cta_box {
	left: 2rem;;
	margin: 0;
	position: absolute;
	top: 112px;
}
.cta_tel_box {
	float: left;
	width: 50%;
}
a.cta_tel::before {
	background-color: #fc534c;
	border-radius: 50%;
	color: #fff;
	content: '\e900';
	font-family: "icomoon";
	font-size: 24px;
	height: 21px;
	left: 0;
	padding: 20px;
	position: absolute;
	top: 4px;
	width: 21px;
	display: flex;
	justify-content: center;
	align-items: center;
}
a.cta_tel {
	color: #fc534c;
	font-size: 46px;
	font-weight: bold;
	line-height: 1;
	padding: 0 0 0 56px;
	white-space: nowrap;
}
a.cta_tel:hover {
	cursor: text;
	text-decoration: none;
	opacity: 0.75;
}
.cta_date {
	font-size: 0.9rem;
	text-indent: 3rem;
}
.cta_mail {
	float: left;
	padding-left: 29px;
	width: 50%;
}
.cta_mail:hover{
	opacity: 0.6;
}
/*===============================================
労働条件・ハラスメント / 相談費用について
===============================================*/
.attention{ margin-top: 5%; }
.attention h3{
	font-size: 170%;
	text-align: center;
	position: relative;
	font-weight: bold;
	margin: 0 auto;
	margin-bottom: 1%;
	width:100%;
}
.attention h3 span{
	display: inline-block;
	border-bottom: 6px solid #e00012;
}
.attention h3::before {
	content: url(/common_api/branch/img/individual/work/attention.svg);
	position: absolute;
	top: 8px;
	right: 12%;
	width: 45px;
}
.attention h3::after {
	content: url(/common_api/branch/img/individual/work/attention.svg);
	position: absolute;
	top: 8px;
	left: 12%;
	width: 45px;
}
.attention p{
	text-align: center;
	font-size: 120%;
}
.attention ul{
	background: #ececec;
	margin: 2% 0;
}
.attention ul li{
	padding: 1%;
	font-size: 80%;
	background: #e00012;
	display: inline-block;
	margin: 2%;
	text-align: center;
	width: calc(20% - 2px);
	color: #fff;
}
.attention ul li:first-child{
	margin-left: 3%;
}
.attention ul li:last-child{
	margin-right: 3%;
}
.attention small p{
	font-weight: bold;
	text-align: left;
}
.attention small ul{
	background: none;
	margin:0 0 2% 0;
	list-style-type:disc;
}
.attention small ul li{
	padding: 0;
	font-size: 0.8rem;
	background: none;
	display: block;
	margin: 0;
	text-align: left;
	width: auto;
	color: #333;
	text-indent: 1.5em;
}
.attention small ul li:first-child,
.attention small ul li:last-child{
	margin: 0;
}
.attention p span.t_red{
	color: #e00012;
	font-weight: bold;
}
.attention p span.b_border{
	border-bottom:2px solid #333;
}
/*==================================================
night
==================================================*/
.night {
	border: 6px solid #c3c3c3;
	margin-top: 3rem;
	padding: 1.2rem;
}
.night img{
	float: left;
	margin-right: 2%;
	width: calc(34% - 2rem);
	max-width: 235px;
}
.night h3 {
	float: left;
	margin: 0 0 1rem;
	width: 68%;
}

.night p{
	float: left;
	width: 68%;
}
/*==================================================
w_accident --only disaster
==================================================*/
.w_accident .w_accident_team {
	width: 100%;
}
.w_accident .w_accident_team img {
	float: left;
	margin-right: 2%;
	width: 49%;
	max-width: 341px;
}
.w_accident .w_accident_team .text {
	float: left;
	line-height: 1.9;
	width: 49%;
}
.w_accident .w_accident_team .text .main_h3 {
	margin: 0 0 1rem;
}
.w_accident .bnrs {
	margin: 2rem 0;
}
.w_accident .bnrs li {
	display: inline-block;
	width: 49%;
	max-width: 380px;
}
.w_accident .bnrs li:first-child {
	margin-right: 2%;
}
.w_accident .bnrs li img {
	max-width: 380px;
}
.w_accident .bnrs li a:hover {
	opacity: 0.6;
}

/*==================================================
豊富な解決実績
==================================================*/
.proven_area dl {
	margin-bottom: 2rem;
}
.proven_area dl dt,
.proven_area dl dd {
	display: inline-block;
}
.proven_area .advice,
.proven_area .judgment {
	border: 2px solid #5269aa;
	color: #5269aa;
	-webkit-border-radius: 4px;
	-moz-border-radius: 4px;
	border-radius: 4px;
	font-weight: bold;
	padding: 0.4rem 2%;
	margin-right: 0.2rem;
}
.proven_area dd {
	font-weight: bold;
	margin-right: 2em;
	vertical-align: middle;
}
.proven_area dd:last-child {
	margin-right: 0;
}
.proven_area .proven_num {
	color: #e00012;
	font-size: 2rem;
	font-weight: normal;
	margin-right: 0.4rem;
}
.proven_area i {
	font-size: 0.8rem;
	font-style: normal;
}
.proven_area .detail .graph {
	float: left;
	width: 52%;
}
.proven_area .detail .graph img {
	max-width: 390px;
}
.proven_area .detail .text {
	float: left;
	width: 48%;
}
.proven_area .detail .text h3.main_h3 {
	border-left: 2px solid #333333;
	margin: 0;
	padding-left: 8px;
}
.proven_area .detail .text p {
	line-height: 1.7;
	margin-top: 1rem;
}
.proven_area .detail .text p .marker {
	color: #e00012;
}
.proven_area .detail .text figure figcaption {
	float: left;
	font-size: 0.7rem;
	margin-top: 3rem;
	padding-right: 2%;
	text-align: right;
	width: 45%;
}
.proven_area .detail .text figure figcaption .title {
	font-size: 1rem;
}
.proven_area .detail .text figure figcaption .name {
	font-size: 1.2rem;
}
.proven_area .detail .text figure p img {
	max-width: 194px;
}
.solution_area table {
	text-align: center;
	margin-bottom: 1rem;
	width: 100%;
}
.solution_area table th,
.solution_area table td {
	border-left: 1px solid #d8d8d8;
	font-weight: 100;
	padding: 1rem;
}
.solution_area table thead th {
	border: 1px solid #d8d8d8;
	background: #d8d8d8;
}
.solution_area table tr:nth-child(2n+1) {
	background: #efefef;
	border-top: 0;
	border-bottom: 0;
}
.solution_area table tr:last-child {
	border-bottom: 1px solid #d8d8d8;
}
.solution_area table td {
	border-left: 1px solid #d8d8d8;
	border-right: 1px solid #d8d8d8;
}
.solution_area table td:first-child {
	width: 20%;
}
.solution_area .caution {
	font-size: 0.8rem;
}
.solution_area .caution li:not(:first-child) {
	padding: 0 0 0 0.8rem;
	text-indent: -0.8rem;
}
.solution_area .caution li:not(:first-child)::before {
	content: "※";
}
/*===============================================
link_list
===============================================*/
.link_list {
	background: #efefef;
	padding: 1em;
	text-align: center;
}
.link_list li {
	display: inline-block;
	line-height: 2;
}
.link_list li::after {
	content: " | ";
}
.link_list li:last-child::after {
	content: none;
}
.link_list li a:hover {
	color: #5269aa;
	text-decoration: underline;
}
/*===============================================
side
===============================================*/
.sidebar .contact li.side_bnr {
	border: none;
}
.sidebar .side_navi li.internal a:hover {
	background: #5269aa;
	color: #ffffff;
}
.sidebar .side_navi li.internal a:hover::before {
	border-left: 6px solid #ffffff;
}

/*===============================================
コンテンツ内バナー
===============================================*/
.bnrs li {
	float: left;
	width: 49%;
	/*margin-bottom: 2%;*/
}
.bnrs li:first-child {
	margin-right: 2%;
}
.bnrs li img {
	max-width: 380px;
}
.bnrs li img:hover{
	opacity: 0.7;
}

/*==================================================
下部テキスト
==================================================*/
section.page_under_area .section_block > ul li{
	list-style-type: disc;
	margin-left: 1em;
}
/*=============================================================================================
タブレット　スマホ　780px以下
=============================================================================================*/
@media only screen and (max-width: 780px) {
	a.cvb_tel {
		font-size: 8vw;
	}
	a.cvb_tel::before {
		left: 5%;
	}
	/*==================================================
	ボタン
	==================================================*/
	.etc_area li {
		width: calc(50% - 2px);
	}
	/*==================================================
	分野ページのetcボタン
	==================================================*/
	.etc_area li a:hover {
		background-color: #f6f6f6;
	}
	.etc_area li.item01 a:hover p:before { content: url(/common_api/branch/img/individual/work/etc_icon01.svg); }
	.etc_area li.item02 a:hover p:before { content: url(/common_api/branch/img/individual/work/etc_icon02.svg); }
	.etc_area li.item03 a:hover p:before { content: url(/common_api/branch/img/individual/work/etc_icon03.svg); }
	.etc_area li.item04 a:hover p:before { content: url(/common_api/branch/img/individual/work/etc_icon04.svg); }
	.etc_area li.item05 a:hover p:before { content: url(/common_api/branch/img/individual/work/etc_icon05.svg); }
	.etc_area li.item06 a:hover p:before { content: url(/common_api/branch/img/individual/work/etc_icon06.svg); }
	.etc_area li.item04 a:after {right: 10px;}
	
	.think_area .think_bnr li {
		display: block;
		margin-bottom: 1rem;
		width: 100%;
	}
	.think_situation .check {
		float: none;
		width: 100%;
	}
	.think_situation img {
		display: block;
		float: none;
		margin: 0 auto 1rem;
		width: 100%;
		max-width: 682px;
	}
	.faq dl {
		width: 100%;
	}
	.faq .faq02,
	.faq .faq03,
	.faq .faq04,
	.faq .faq05,
	.faq .faq06 { 
		margin-top: 2rem;
	}
	.think_area .bnrs li {
		display: block;
		margin: 1rem 0 0;
		text-align: center;
		width: 100%;
	}
	.think_area .bnrs li img {
		width: 100%;
	}
	.think_area .bnrs li a:hover {
		opacity: 0.6;
	}
	/*==================================================
	think_area
	==================================================*/
	.think_area .btn,
	.right_btn {
		width: 90%;
	}

	/* ==================================================
	cta_area
	==================================================*/	
	.cta_area {
		border: 8px solid #5269aa;
		max-width: 740px;
		position: relative;
		width: 100%;
	}
	.cta_area .cta_img img {
		width: 100%;
	}
	.cta_area .cta_box {
		left: 0;
		margin-bottom: 1rem;
		position: relative;
		top: 10px;
	}
	.cta_area .cta_box .cta_tel_box img {
		margin: 0 auto 0.6rem;
		width: 100%;
		max-width: 345px;
	}
	.cta_area .cta_box .cta_mail img {
		margin: 0 auto 0.6rem;
	}
	.cta_tel_box,
	.cta_mail {
		float: none;
		margin: 0 auto;
		text-align: center;
		width: 90%;
	}
	.cta_tel_box {
		padding: 0 1rem;
		width: 100%;
	}
	.cta_date {
		text-indent: 0;
	}
	.cta_mail {
		width: 100%;
	}
	a.cta_tel {
		display: flex;
		justify-content: center;
		align-items: center;
		padding: 0 8px 0 0;
		font-size: 8vw;
	}
	a.cta_tel.pc_only {
		display: none;
	}
	.c-btn__tel a.cta_tel {
		/*display: block;*/
		padding: .75rem 1rem;
		font-size: 6vw;
	}
	.c-btn__tel a.cta_tel::before {
		top: 0;
	}
	a.cta_tel::before {
		position: relative;
		top: -2px;
		left: -4px;
		width: 6vw;
		height: 6vw;
		margin-top: 0.6rem;
		padding: 1.2vw;
		line-height: 1.2;
		font-size: 5vw;
	}
	.cta_mail img {
		display: block;
		margin: 0 auto;
		width: 90%;
		max-width: 345px;
	}
	/* ==================================================
	w_accident  --only disaster
	==================================================*/	
	.w_accident .w_accident_team img {
		display: block;
		float: none;
		margin: 0 auto 1rem;
		width: 100%;
		max-width: 682px;
	}
	.w_accident .w_accident_team .text {
		float: none;
		width: 100%;
	}
	.w_accident .bnrs li {
		display: block;
		margin: 0 auto 1rem;
		width: 100%;
	}
	.w_accident .bnrs li:first-child {
		margin: 0 auto 1rem;
	}
	.w_accident .bnrs li img {
		width: 100%;
	}
	/*===============================================
	労働条件・ハラスメント / 相談費用について
	===============================================*/
	.attention h3{
		position: none;
	}
	.attention h3::before,
	.attention h3::after {
		content: none;
	}
	.attention ul{
		background: #ececec;
		margin: 2% 0;
	}
	.attention ul li:first-child {
		margin-left: 2%;
	}
	.attention ul li{
		font-size: 110%;
		background: #e00012;
		display: inline-block;
		text-align: center;
		width: calc(45% - 2px);
		color: #fff;
		line-height: 1.3;
		padding: 3%;
	}
	.attention small ul li{
		line-height: 1.2;
		text-indent: 0;
	}
	/* ==================================================
	night
	==================================================*/	
	.night img {
		display: block;
		float: none;
		margin: 0 auto;
		width: 100%;
		max-width: 475px;
	}
	.night h3 {
		float: none;
		margin-top: 1rem;
		width: 100%;
	}
	.night p{
		float: none;
		width: 100%;
	}
	/* ==================================================
	proven_area
	==================================================*/	
	.proven_area dl dt, .proven_area dl dd {
		display: block;
		text-align: center;
	}
	.proven_area i {
	float: right;
	}
	.proven_area .detail .graph {
		display: block;
		float: none;
		margin: 1em auto;
		text-align: center;
		width: 100%;
	}
	.proven_area .detail .graph img {
		width: 100%;
	}
	.proven_area .detail .text {
		float: none;
		width: 100%;
	}
	.proven_area .detail .text figure figcaption {
		width: 38%;
	}
	.proven_area .detail .text figure p img {
		width: 60%;
	}
	.proven_area .detail .text figure figcaption {
		margin-top: 1rem;
	}
	.proven_area .detail .text figure figcaption .title {
		display: block;
	}
	/* ==================================================
	コンテンツ内バナー
	==================================================*/
	.bnrs li {
		float: none;
		margin: 1rem auto;
		text-align: center;
		width: 100%;
	}
	.bnrs li a img {
		width: 100%;
		max-width: 360px;
	}
}
/*=============================================================================================
タブレット　スマホ　400px以下
=============================================================================================*/
@media only screen and (max-width: 400px) {
	a.cvb_tel {
		font-size: 8.4vw;
	}
	a.cvb_tel::before {
		left: 2%;
	}
	a.cta_tel::before {
		margin-top: 1.7vw;
	}
	.solution_area table,
	.solution_area table tbody,
	.solution_area table tbody tr,
	.solution_area table tbody th,
	.solution_area table tbody td {
		display: block;
	}
	.solution_area table thead {
		display: none;
	}
	.solution_area table tr:nth-child(2n+1) {
		background: #ffffff;
	}
	.solution_area table th {
		background: #d8d8d8;
	}
	.solution_area table tbody td {
		text-align: left;
		font-weight: bold;
	}
	.solution_area table tbody td:nth-child(2)::before {
		content: "解決件数: ";
		font-weight: 100;
	}
	.solution_area table tbody td:nth-child(3) {
		padding-top: 0;
	}
	.solution_area table tbody td:nth-child(3)::before {
		content: "解決金金額: ";
		font-weight: 100;
	}
	.proven_area .proven_num {
		font-size: 9vw;
	}

}
/* //レスポンシブ設定 */