/*

Template:jyujyu2026

Theme Name:juju-custom 2026 SP

Theme URI:http://www.juju-law.jp/

Description:

Author:Masakuni Nishiwaki

Version:20190523

*/









/* カスタマイズここから

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





ul.ryakureki li span {

	float: left;

	position: relative;

	width: 8em;

}





/* トップページ

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

dl.feed dt {

	width: 140px;

	margin-left: 15px;

}



dl.feed dd {

	width: 540px;

}



div.service-section-juju {

	margin-left: 20px;

	width: 690px;

}



div.service-section-juju div.service-section {

	width: 330px;

}



body {

	-webkit-text-size-adjust: 100%;

}





/* スタッフページ

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



div#primary ul.staff-nav {

	margin: 0 auto 30px 40px !important;

}



div#primary ul.staff-nav li {

	margin: 0 40px 0 0 !important;

}



/* 404

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



.title-404 {

	text-align: center;

	font-size: 36pt;

	margin-top: 20px;

	margin-bottom: 25px;

}



.entry-404 {

	text-align: center;

}





/* メッセナゴヤ

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



h2.messenagoya {

	text-align: center;

	font-size: 32pt;

	color: #e4007b;

	position: relative;

	padding: .3em;

	padding-top: .6em;

	padding-bottom: .4em;

	background-color: #fff;

	border-radius: 10px;

	border: 1px solid #666;

	margin: 20px;

	margin-bottom: 50px;

}



div.messenagoya {

	text-align: center;

	font-size: 1.2em;

}



div.messenagoya p {

	line-height: 2em;

	padding: 10px;

}



div.messenagoya p.kikaku {

	text-align: left;

	line-height: 2em;

	margin: 0 20px 20px 40px;

	padding: 0 10px 10px 40px;

}



div.messenagoya div.kaiki {

	font-size: 28pt;

	font-weight: bold;

	color: rgb(27, 64, 147);

	margin-bottom: 70px;

}



div.messenagoya h3 {

	position: relative;

	text-align: left;

	padding: .25em 0 0 1.25em;

	margin: 0 20px 10px 40px;

	border-left: 10px solid #ccc;

}



div.messenagoya h3::before {

	position: absolute;

	left: -10px;

	bottom: 0;

	content: '';

	width: 10px;

	height: 50%;

	background-color: #8fc130;

}



div.messenagoya h3::after {

	position: absolute;

	left: 0;

	bottom: 0;

	content: '';

	width: 95%;

	height: 0;

	border-bottom: 1px solid #ccc;

}



div.messenagoya p b {

	font-size: 1.5em;

	color: #1b4093;

}



div.messenagoya div.booth {

	text-align: center;

	font-size: 18pt;

	color: #039;

	position: relative;

	padding: .3em;

	padding-top: .6em;

	padding-bottom: .4em;

	background-color: #fff;

	border-radius: 10px;

	border: 1px solid #666;

	margin: 50px 20px;

	margin-top: 70px;

}



div.booth span {

	color: #f00;

	font-size: 24pt;

	font-weight: bold;

}



div.messenagoya ul {

	display: inline-block;

	text-align: left;

	margin-top: 10px;

	margin-bottom: 30px;

}



div.messenagoya ul li {

	list-style-type: disc;

}



dl.messenagoya {

	display: inline-block;

	margin: 20px;

	font-weight: bold;

}



dl.messenagoya dt {

	display: block;

	float: left;

	clear: left;

}



dl.messenagoya dd {

	display: block;

	float: left;

	margin-left: 2em;

}



div.messenagoya div.past {

	margin-top: 70px;

}







textarea, input {

	font-family: "ヒラギノ角ゴ Pro W3", "メイリオ","Meiryo","Hiragino Kaku Gothic Pro", "Osaka", "ＭＳ Ｐゴシック", sans-serif;

}







div#primary p {

	padding-left: 1.5em;

}







/* 採用ページ

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



body.page-id-700 h2.pagetitle {

	text-align: right;

	font-size:2.2em;

	font-weight: normal;

	padding-top:48px;

	padding-right: 20px;

	height: 92px;

}





/* 報酬ページ

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





body.page-id-1029 h2.pagetitle,

body.page-id-1041 h2.pagetitle,

body.page-id-870 h2.pagetitle,

body.page-id-878 h2.pagetitle,

body.page-id-900 h2.pagetitle,

body.page-id-921 h2.pagetitle,

body.page-id-926 h2.pagetitle,

body.page-id-898 h2.pagetitle {

	text-align: right;

	line-height: 143px;

	font-family: "游明朝", YuMincho, "ヒラギノ明朝 ProN W3", "Hiragino Mincho ProN", "HG明朝E", "ＭＳ Ｐ明朝", "ＭＳ 明朝", serif;

	font-weight: bold; 

	font-size: 28px;

	padding-right: 20px;

}



div#primary div.section2 h4.feetop {

	font-size: 16px;

	margin-left: 30px;

	margin-bottom: 0px;

}



div#primary div.section2 h4.feetop a {

	text-decoration: none;

}



div#primary div.section2 h4.feetop a:hover {

	text-decoration: underline;

}



div#primary div.section2 h4.feetop + p {

	margin-left: 45px;

	margin-bottom: 25px;

}



div#primary div.section2 h4.fee {

	font-size: 16px;

}



div#primary div.section2 ul.fee {

	margin-left: 15px;

	margin-bottom: 10px;

}



div#primary div.section2 ul.fee li {



}



div#primary div.section2 ul.footnote {

	margin-left: 55px;

	margin-top: 0px;

	margin-bottom: 15px;

}



div#primary div.section2 ul.footnote li {

	position: relative;

	background: none;

	padding-left: 5px;

}



div#primary div.section2 ul.footnote li p {

	padding-left: 0px;

	padding-bottom: 0px;

	margin-bottom: 0px;

}



div#primary div.section2 ul.footnote li ol {

}



div#primary div.section2 ul.footnote li ol li {

	list-style-type: decimal;

	padding: 0px;

	padding-left: 1em;

	margin: 0px;

}



div#primary div.section2 ul.footnote li ol li:after {

	border: none;

}



div#primary div.section2 ul.footnote li::after {

	display: block;

	content: '';

	position: absolute;

	top: .5em;

	left: -1em;

	width: 8px;

	height: 3px;

	border-left: 2px solid #080;

	border-bottom: 2px solid #080;

 	-webkit-transform: rotate(-45deg);

	transform: rotate(-45deg);

}





div#primary div.section2 ol.fee {

	margin-left: 0px;

}



div#primary div.section2 ol.fee li {

	list-style-type: decimal

}





table.soudan {

	width: 40%;

	margin-left: 5%;

	margin-bottom: 20px;

}



table.fee td.ctax,

table.soudan td.ctax {

	padding: 0px;

	text-align: right;

	border-top: none;

	border-right: none;

	border-left: none;

	border-bottom: none;

}



table.fee th, table.fee td, 

table.soudan th, table.soudan td,

table.feeip1 th, table.feeip1 td,

table.feeip2 th, table.feeip2 td {

	border: solid #999 1px;

	padding: 0.5em;

}





table.fee, table.feeip1, table.feeip2 {

	width: 90%;

	margin-left: 5%;

	margin-bottom: 20px;

}







table.fee th.main {

	width: 30%;

}







th.fee1st, th.fee2nd {

	text-align: center;

	font-weight: bold;

	color: #fff;

	background-color: #8c3;

}







th.fee1st {

	width: 45%;

}







th.fee2nd {



}



td.fee1st {

	background-color: #eee;

}



td.fee2nd {

	background-color: #fff;

}





/* fee 知財-------------------------------------------- */



th.feeip1th, th.feeip3th, th.feeip5th {

	text-align: center;

	font-weight: bold;

	color: #fff;

	background-color: #8c3;

	width:28%;

}



td.feeip1td, td.feeip3td {

	text-align: center;

	background-color: #fff;

}



table.feeip1 td.feeip5td {

	text-align: center;

	background-color: #fff;

}





table.feeip1 td.feeip2td,

table.feeip1 td.feeip4td,

table.feeip2 td.feeip2td {

	text-align: center;

	border-top: none;

	border-bottom: none;

}



table.feeip2 td.feeip4td,

table.feeip2 td.feeip5td {

	border: none;

}



table.feeip2 td.feeip5td {

	width:28%;

}



img.wp-image-1136 {

	margin: 20px;

}





/* レスポンシブ対応（スマートフォン・タブレット）

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



@media screen and (max-width: 768px) {



	html, body {

		overflow-x: hidden;

		-webkit-text-size-adjust: 100%;

	}



	img, iframe, video, embed, object {

		max-width: 100%;

	}



	img {

		height: auto;

	}



	/* 全体の幅を画面に合わせる */

	div#head,

	div#wrap {

		width: auto !important;

		max-width: 100%;

		box-sizing: border-box;

	}



	div#wrap {

		padding-left: 10px;

		padding-right: 10px;

	}



	/* ヘッダー：絶対配置をやめて、上から順に並べる */

	div#head {

		height: auto !important;

		padding: 10px 10px 0;

	}



	div#head h1,

	div#head p,

	p.head-logo,

	p.head-contact,

	p.eng {

		position: static !important;

		margin: 0 0 10px !important;

		text-align: left;

	}



	div#head h1 {

		font-size: 11px;

		line-height: 1.4;

	}



	/* グローバルナビ・フッターナビ：折り返して並べる */

	ul#g_nav,

	ul#f_nav {

		position: static !important;

		display: flex;

		flex-wrap: wrap;

		width: auto !important;

		left: auto !important;

		margin: 0 !important;

		padding: 0;

		box-sizing: border-box;

	}



	/* ボタン画像は元の幅がバラバラなので、全部を同じ縮尺（高さ）にそろえる。

	   1行に3個ずつ並ぶ大きさ（3個の幅の合計は約422px）に合わせる */

	ul#g_nav li,

	ul#f_nav li {

		float: none !important;

		height: auto !important;

		flex: 0 0 auto;

		margin: 0 !important;

		padding: 2px;

		list-style: none;

	}



	ul#g_nav li a,

	ul#f_nav li a {

		display: block;

	}



	ul#g_nav li img,

	ul#f_nav li img {

		display: block;

		width: auto !important;

		max-width: none !important;

		height: 44px !important;

		height: min(44px, calc((100vw - 36px) / 422 * 44)) !important;

		margin: 0;

	}



	ul#f_nav {

		padding: 0 10px;

	}



	/* 本文とサイドバーを縦に並べる */

	div#primary {

		width: auto !important;

		float: none !important;

		clear: both;

	}



	div#sidebar,

	div#sidebar div.block {

		width: auto !important;

		float: none !important;

		clear: both;

		box-sizing: border-box;

	}



	div#sidebar div.entry table.publish,

	div#sidebar div.entry dl.lecture dt,

	div#sidebar div.entry dl.lecture dd {

		width: auto !important;

	}



	/* サイドバーの見出し：背景を左端から、幅いっぱいに広げる（sidebar-title）

	   ※ 直下の h3 だけが対象。本文中の小見出し（点のアイコン）は除く */

	div#sidebar div.block > h3 {

		box-sizing: content-box;

		width: auto !important;

		margin-left: 0 !important;

		margin-right: 0 !important;

		line-height: 24px;

		background-position: left center !important;

		background-repeat: no-repeat !important;

		background-size: 100% 100% !important;

	}



	/* Facebook の枠 */

	div#sidebar iframe {

		max-width: 100% !important;

	}



	/* アクセスの地図：横幅に合わせて拡大（access-map） */

	div#sidebar a[href*="access.pdf"] img {

		width: 100% !important;

		max-width: 480px;

		height: auto !important;

	}



	/* ページ上部のバナー：画像全体が、画面の幅に合わせて表示されるようにする（pagetitle）

	   PC 版の大きさ（幅960px × 高さ140px、トップは290px）と同じ縦横比を保つ */

	h2.pagetitle {

		box-sizing: border-box;

		height: auto !important;

		min-height: 0 !important;

		aspect-ratio: 960 / 140;

		background-size: 100% 100% !important;

		background-position: left top !important;

		background-repeat: no-repeat !important;

	}



	body.page-id-2 h2.pagetitle {

		aspect-ratio: 960 / 290;

	}



	/* タイトルの文字が、画像の上に表示されるページ */

	body.page-id-700 h2.pagetitle,

	body.page-id-1029 h2.pagetitle,

	body.page-id-1041 h2.pagetitle,

	body.page-id-870 h2.pagetitle,

	body.page-id-878 h2.pagetitle,

	body.page-id-900 h2.pagetitle,

	body.page-id-921 h2.pagetitle,

	body.page-id-926 h2.pagetitle,

	body.page-id-898 h2.pagetitle {

		display: flex;

		align-items: center;

		justify-content: flex-end;

		line-height: 1.3 !important;

		padding: 0 10px !important;

		font-size: 18px !important;

		font-size: clamp(13px, 4.5vw, 20px) !important;

	}



	/* 固定幅のブロックを、画面幅に合わせる */

	.service-section,

	div.service-list,

	div.service-section-juju,

	div.service-section-juju div.service-section,

	div.section2 dl.fl,

	div.section2 dl.fr {

		width: auto !important;

		float: none !important;

		margin-left: 0 !important;

		margin-right: 0 !important;

		min-height: 0 !important;

	}



	dl.feed dt,

	dl.feed dd,

	dl.lecture dt,

	dl.lecture dd {

		float: none !important;

		width: auto !important;

		clear: none !important;

		margin-left: 0 !important;

	}



	div#primary dl.lecture,

	div#primary div.publish {

		height: auto !important;

		overflow: visible !important;

	}



	/* スタッフ紹介のナビ */

	div#primary ul.staff-nav {

		margin: 0 0 20px 10px !important;

	}



	div#primary ul.staff-nav li {

		margin: 0 15px 10px 0 !important;

	}



	/* 画像の回り込みを解除 */

	img.left, img.right,

	.alignleft, .alignright {

		float: none !important;

		display: block;

		margin: 10px auto !important;

	}



	/* 本文内の表 */

	div#primary table {

		max-width: 100%;

	}



	table.fee, table.feeip1, table.feeip2, table.soudan {

		width: 100% !important;

		margin-left: 0 !important;

	}



	/* お問い合わせフォーム */

	table.contact-table,

	table.contact-table tbody,

	table.contact-table tr,

	table.contact-table th,

	table.contact-table td {

		display: block;

		width: 100% !important;

		box-sizing: border-box;

	}



	table.contact-table td [class*="cform"],

	table.contact-table td textarea,

	table.contact-table td input[type="text"],

	table.contact-table td input[type="email"],

	table.contact-table td input[type="tel"] {

		max-width: 100%;

		box-sizing: border-box;

	}



	table.contact-table td .cform3,

	table.contact-table td .cform5,

	table.contact-table td textarea {

		width: 100% !important;

	}



	/* メッセナゴヤ・404 の大きな文字 */

	h2.messenagoya {

		font-size: 20pt;

		margin: 10px 0 30px;

	}



	div.messenagoya div.kaiki {

		font-size: 18pt;

		margin-bottom: 40px;

	}



	div.messenagoya div.booth {

		font-size: 13pt;

		margin: 30px 0;

	}



	div.booth span {

		font-size: 16pt;

	}



	div.messenagoya h3,

	div.messenagoya p.kikaku {

		margin-left: 0;

		margin-right: 0;

	}



	.title-404 {

		font-size: 22pt;

	}



	/* フッター：ページトップのリンク（元の幅指定を上書き） */

	div#foot div[style*="960px"] {

		width: auto !important;

		box-sizing: border-box;

		padding-right: 10px;

	}



	div#foot p#copyright {

		padding: 0 10px;

	}

}

