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

body {
	background-image: linear-gradient(RGBA(255, 249, 196, 0.1), RGBA(255, 249, 196, 0.1)), url("images/meister-portal/bg_meister-portal.jpg");

}

@media (max-width: 640px) {
	#content {
		padding-left:10px;
		padding-right:10px;
	}
}

/* サイドバーメニュー */
#meister-menu ul{
	margin-top:10px;
	padding-left: 0;
	list-style-image:none;
	list-style-type:none;
	list-style-position: outside;
}

#meister-menu li{
	border: 1px solid #aaa;
	border-bottom: none;
	background: #C8A18C;
	background-image: linear-gradient(rgba(255,255,255,0.85) 50%, rgba(255,255,255,0.6) 80%, rgba(255,255,255,0.2));	
	max-height: 5rem;
	overflow: hidden;
	display: flex;
	align-items: center;
	
}	

#meister-menu li:last-child{
	border-bottom: 1px solid #aaa;
}
#meister-menu li a{
	padding:30px 20px ;
	display:block;
	width: 100%;
	font-size: 120%;
	line-height: 1.4;
	font-weight:bold;
	color:#3E2723;
}
#meister-menu li a:hover{
	background: #C8A18C;
	background-image: linear-gradient(rgba(255,255,255,0.3) 20%, rgba(255,255,255,0.5) 80%, rgba(255,255,255,0));
transition: all 0.2s ease;
}


#meister-menu li:before {
	content: none;
}



/* 見出し */
#content h2 {
	padding:60px 10px;
	background: #f2ede6;
	background-image: url("images/meister-portal/bg_title.jpg");
	background-repeat: no-repeat;
	background-position: right center;
	border-color: #F48FB1;
}

#content h3 {
	border-bottom: none;
	background-image: linear-gradient(rgba(255,255,255,0.5), rgba(255,255,255,0.5));
	padding:20px 20px 20px 25px;
	border-left: 2px solid #FF80AB;
	margin-top:50px;
	margin-bottom: 30px;
}


#content h4 {
	font-size: large;
	background: none;
	text-align: left;
	color:#000;
	padding:0;
	padding-left: 5px;
	margin-top:30px;
	border-bottom: 1px solid #FFC107;
}

#content .sq-list h4 {
	text-align: center;
}

#content .sq-list h4:after {
	content: " さん";
	font-size: medium;
}

#content h5 {
	color:#E91E63;
	font-weight: bold;
	font-size: 100%;
/*	margin-top: 30px; */
}
#content h6 {
	background: transparent;
	font-size:small;
	padding:5px;
	display:inline-block; 
	border-bottom: 1px solid #FF6F00;
}


/* 新着情報のSNSボタン消し */
.panel .wp_social_bookmarking_light {
	display: none;
}


/* テーブル */
#content thead th {
	background: #A1887F;
	color:#fff;
}
#content tbody th {
	background: #D7CCC8;
}
#content tbody th {
	width: 20%;
}
#content .text-center td {
	text-align: center;
}

/* リード文 */
#content .lead {
	font-size: 105%;
	font-weight:bold;
	line-height:1.4;
	color:#3E2723;
}


/* 関連リンクUL */
#content ul.links {
	list-style-image: url("https://www.ibarakiguide.jp/wp-content/themes/FromMeToYou/css/images/li-orange.png");
	list-style-position: inside;
}

/* スライダー */
#content .flexslider {
	margin:0 !important;
}

/* タブ部分 */

#sq-infolist {
	
}
#sq-infolist dd{
	margin-right: 20px;
}
#sq-infolist dd a{
	padding:10px 20px !important;
}
@media (max-width: 640px) {

#sq-infolist dd a span{
	display:none;
}
#sq-infolist dd a:after {
	content: "別";
}
#sq-infolist dd a{
	padding:10px !important;
}

}

.tabs-panel {
	overflow: hidden;
	padding:1rem .5rem;
}

.tabs dd.active a {
	background: #FFD740 !important;
}
.tabs dd > a:hover {
	background: #FFECB3 !important;
}


#content .sq-tab-panel ul,
#content .tab-sq ul {
	list-style-image:none;
	list-style-type:none;
	list-style-position: outside;
}

#content .tab-sq {
	margin:0;	
}
#content .tab-sq .content {
	padding:15px 10px 20px !important;
	background:#F5F5F5;
	border: none;
	border-radius: 5px;
	overflow: hidden;
}

#content .yoko {
	margin-left: 0;
}

#content .yoko li{
	float:left;
	margin-right: 15px;
	font-size:1rem;
	font-weight:bold;
}
#content .yoko li:before {
	content: "\f005";
	font-family: 'Font Awesome\ 5 Free';
	color:#FF6D00;
	padding-right: 2px;
	position: static;

}


/* 擬似タブ風スタイル */
#content .sq-tab {
	padding:10px 20px !important;
	border-bottom: none;
	font-size: medium;
	background: #FFECB3;
	display:inline-block;
	
}
#content .sq-tab-panel {
	padding:15px 10px 20px !important;
	background:#F5F5F5;
	border: none;
	border-radius: 5px;
	overflow: hidden;
	
}



#content .info span:before {
	background: #1976D2;
	color:#fff;
}

#content .info-table{
	box-shadow: none;
	border-left: none;
	border-right: none;
}

#content .info-table thead th {
	background: #E3F2FD;
}

#content .info-table th {
	background-color: #fff ;
	border-right: none;
	text-align: left;
	font-weight: normal;
	width:10em;
}

@media only screen and (max-width: 640px) {
#content .info-table th {
	width:6em;
}
}

#content .info-table td {
	border-right: none;
}

@media only screen and (min-width: 641px) {
#content .content-title{
	position:relative;
	}
#content .content-title .logo{
	position:absolute;
	top:10px;
	left:15px;
	margin:0 !important;
	padding:10px;
	}
#content .content-title .text{
	position:absolute;
	bottom: 0;
	left:15px;
	margin:0 !important;
	padding:10px;
	}
	
#content .content-title .text h2 {
	border: none;
	background: none;
	font-size:4rem;
	color:#fff;
	font-family: serif;
	margin-bottom: 0;
	padding-bottom: 0;
}
#content .content-title .text h3 {
	border-bottom-color : #B2EBF2;
	color:#fff;
	margin-bottom: 0;
}
#content .content-title .text h4 {
	background: none;
	padding: 0;
	margin-top: 0;
	font-size:3rem;
	color:#fff;
	font-family: serif;
	text-align: right;
}
#content .content-title .description {
	border-bottom : 1px solid #B2EBF2;
	font-size: x-large;
	color:#fff;
	margin-bottom: 0;
}
#content .content-title .city {
	background: none;
	padding: 0;
	margin-top: 0;
	font-size:3rem;
	color:#fff;
	font-family: serif;
	font-weight: bold;
	text-align: right;
}
}
@media only screen and (max-width: 640px) {
#content .content-title .description {
	font-size: large;
}	
}


.medium-9.medium-centered.cell img {
	margin-left:auto;
	margin-right: auto;
}
.panel.yellow{
	margin-bottom: 1rem;
}

.detail {
	text-align: center;
}
.detail .button {
	font-size: small;
	padding:8px 25px;
	border-radius: 50px;
	background: #B3E5FC;
	color:#455A64;
}
.detail .button:hover {
	background: #80DEEA;
	color:#455A64;
}	

.linkbox {
	border: none;
	overflow: hidden;
}


.linkbox a {
	width: 100%;
	height: 100%;
	position: absolute;
	top:0;
	bottom: 0; 
	margin:0;
	padding-top: 1em;
	padding-bottom: 10px;
	padding-right:5px;
	overflow: hidden;
	text-align: left;
	color:#E91E63;
	font-size:x-small;
	text-indent: -999px;
}

.linkbox a:after {
	content: "";
    font-family: 'Font Awesome\ 5 Free';
}
@media only screen and (min-width: 641px) {
.linkbox a:before {
	content: "";
}
}
@media only screen and (max-width: 640px) {
.linkbox a:before {
	content: "";
}


.linkbox p:after {
	display: block;
	content: "";
	position: absolute;
	top: 50%;
	right: 5px;
	width: 10px;
	height: 10px;
	margin: -4px 0 0 0;
	border-top: solid 2px #03A9F4;
	border-right: solid 2px #03A9F4;
	-webkit-transform: rotate(45deg);
	transform: rotate(45deg);
}

}

@media only screen and (min-width: 641px) {
.linkbox p:after {
	content: "くわしくみる \f138";
	font-family: FontAwesome;
	background:#00BCD4;
	color:#fff;
	font-size: x-small;
	padding:1px 3px;
	border-radius: 20px;
	display: block;
	width:7rem;
	text-align: center;
	margin-top: 10px;
	margin-left:auto;
}

.linkbox p:after {
	font-size: small;
	margin: 10px auto;
}
}


a.button.more {
	background:#00BCD4;
	color:#fff;
	font-size: normal;
	padding:10px 5px;
	border-radius: 30px;
	display: block;
	text-align: center;
	margin: 10px 40px;
}
a.button.more:hover {
	background:#CDDC39;
}

a.button.more:after {
	content: "\f138";
	font-family: 'Font Awesome\ 5 Free';
}

.jump-menu {
	margin-bottom: 10px;
}
.jump-menu li {
	padding-bottom: 5px;
}
.jump-menu .button{
	width: 100%;
	font-size: small;
	padding:10px 0;
	border-radius: 30px;
	background: #64B5F6;
}
.jump-menu a:hover{
	background: #90CAF9;
}

.jump-menu a:after {
	content: "\f13a";
	font-family: 'Font Awesome\ 5 Free';
	margin-left:3px;
}

.jump-menu.bottom {
	margin-top: 20px;
}

.jump-menu.bottom a:after {
	content: "\f139";
	font-family: FontAwesome;
	margin-left:3px;
}

.back {
	border-left:1px dashed #BBDEFB;
}

.back li {
	padding: 0 !important;
	display:table;
	line-height: 1.3;
}

.back li.v a:before {
	content: "\f104";
	font-family: 'Font Awesome\ 5 Free';
	font-size: xx-large;
	}
.back li.vv a:before {
	content: "\f104\f104";
	font-family: 'Font Awesome\ 5 Free';
	font-size: xx-large;
	}
.back li.o a:before {
	content: "\f106";
	font-family: 'Font Awesome\ 5 Free';
	font-size: xx-large;
	}
.back li.n a:after {
	content: "\f105";
	font-family: 'Font Awesome\ 5 Free';
	font-size: xx-large;
	}

.back a {
	display:table-cell;
	vertical-align:middle;
	background: #fff;
	color:#607D8B;
	border-top:1px solid #BBDEFB;
	border-right:1px dashed #BBDEFB;
	height: 80px;
	overflow: hidden;
	padding:0 5px;
}
.back a:hover {
	background: #fafafa;
	color:#EF9A9A;
	}
	
ul.collapse li{
	margin: 0 !important;
	padding:0 !important;
}

@media only screen and (min-width: 641px) {
#popular-fishes .large-4 {
	min-height: 35em;
}
}

#content .js-masonry_article.columns  {
	padding-left: 0.9375em;
	padding-right: 0.9375em;
}

#content .photo img {
	margin-top: 20px;
}
@media (max-width: 640px) {
#content .photo img {
	margin-top: 10px;
}

}

.single-kanko-meister .photo img {
	margin-top: 0 !important;
}


#content .personal-data p {
	font-size: 80%;
	line-height: 1.4;
	margin:1px 10px;
}
#content .label-job {
display: inline-block;
margin: 2px;
padding: 0 4px 0 0;
border-radius: 3px;
background: #6D4C41;
color: #fff;
border: 2px solid #6D4C41;
font-weight: bold;
font-size: 100%;
}
#content .label-job:before {
content: "業種：";
padding-left: 5px;
}
#content .県北, #content .県央, #content .県南, #content .県西, #content .鹿行 {
font-size: 100%;
}

/* 詳細ページのcallout */
@media (min-width: 641px) {
#content .single-kanko-meister .callout.yellow.medium-12.cell {
	padding:2rem;
}
}

/* 元・吹き出し */
#content .fukidashi {
	background: #ffffff;
	border: 3px solid #EF9A9A;
	border-radius: 8px;
	padding:10px 20px !important;
	font-weight: bold;
	color:#000;
	margin: 0 ;
	margin-bottom: 10px;
}
#content .single-kanko-meister .fukidashi {
	margin-top:2rem;
	margin-bottom:2rem;
}

@media only screen and (max-width: 640px) {
	#content .fukidashi {
		line-height: 1.4;
		padding:10px !important;
		
	}
}
/* S級紹介パネル */
#content .sq-list .panel {
	padding:20px 30px;
	border-radius: 5px;
	box-shadow:0 2px 4px rgba(0, 0, 0, 0.2);
	border:1px solid #FFEA00; 
}
@media only screen and (max-width: 640px) {
#content .sq-list .panel {
	padding:10px;
}
}
/* 顔写真 */
#content .sq-list .panel img{
	border-radius: 8px;
}


#content .job:before {
	content: "勤務先";
	font-weight: bold;
	background: #FFEB3B;
	padding: 2px 4px;
	margin-right: 5px;
	
}
#content .job {
	font-weight: bold;
	font-size: medium;
}
#content .job a {
	padding:2px 4px;
}

#content .gaibu.hide {
	display: none;
}


/*jQuery プラグイン Masonry */
/* marginやborderも含めてコンテンツの横幅を指定できるようにする */
*{ 
    box-sizing: border-box;
    -webkit-box-sizing: border-box;
    -moz-box-sizing: border-box;
    -ms-box-sizing: border-box;
    -o-box-sizing: border-box;
}
.js-masonry{
    width: 100%;
}
.width_50{
    width: 50%;
    margin: 0;
}



/* 年度別のテーブル */
#content .sq-list {
	margin-bottom:50px;
}
#content .sq-list th.sq-name {
	width: 15%;
}
#content .sq-list th.sq-area {
	width: 8%;
}
#content .sq-list th.sq-city {
	width: 12%;
}
#content .sq-list th.sq-job {
	width: 20%;
}
#content .sq-list th.sq- {
	width: %;
}


#content .sq-list tbody th {
	text-align: left;
}


@media (max-width: 640px) {
#content .sq-list th.sq-name {
	width: 15%;
}
#content .sq-list .sq-area {
	display:none;
}
#content .sq-list th.sq-city {
	width: 12%;
}
#content .sq-list th.sq-job {
	width: 20%;
}
#content .sq-list .sq-office {
	display: none;
}

}

/* 個人別ページ */
#content .tokui {
	font-size:large;
	margin:10px;
}
#content .tokui span{
	font-weight:bold;
	color:#f00;
}
.single-kanko-meister #content .callout img {
	margin-bottom: 2rem;	
}



/* マイスター試験要綱 */
#content .youkou {
	background:#FFFAC7;
}
#content .youkou p {
	color:#333;
	/* font-size: large; */
}
#content .youkou h3 {margin-top:0;}
#content .youkou h4 {
	color:#fff;
	background: #132185;
	border: none;
	font-size: medium;
	text-align: center;
	margin-top: 0;
	padding:2px;
}
#content .youkou h5 {
margin: 5px 0 5px 10px;
font-size: 105%;
font-weight: bold;
color: #5D4037;
line-height: 1.3;
}
#content .youkou .rabel{
	background: #132185;
	color:#fff;
	margin-right: 5px;
	padding:2px 5px;
}
#content .kaijo .callout {
	padding:0.5rem;
}
#content .kaijo p{
	font-size:90%;
}

