

/*ボタン装飾*/
.button {
  position: relative;
  background-color: #f7d034;
  border-radius: 4px;
  color: #fff;
  line-height: 52px;
  -webkit-transition: none;
  transition: none;
  box-shadow: 0 3px 0 #f7ba59;
  text-shadow: 0 1px 1px rgba(0, 0, 0, .4);
	padding:10px;
}
.button:hover {
  top: -4px;
  box-shadow: 0 7px 0 #f7ba59;
}
.button:active {
  top: 3px;
  box-shadow: none;
}
.content a:hover{
	border-color: #ffd700;
}
.content a{
	color: #800000;
	font-weight:bold;
}
/*記事内テーブル*/

table.company {
    width: 100%;
    margin: 0 auto;
    font-size: 12px;
	margin-top: 30px;
	margin-bottom: 30px;
}
 
table.company th,
table.company td {
    padding: 10px;
}
 
table.company th {
    background: #295890;
    vertical-align: middle;
    text-align: left;
    width: 100px;
    overflow: visible;
    position: relative;
    color: #fff;
    font-weight: normal;
    font-size: 18px;
}
 
table.company th:after {
    left: 100%;
    top: 50%;
    border: solid transparent;
    content: " ";
    height: 0;
    width: 0;
    position: absolute;
    pointer-events: none;
    border-color: rgba(136, 183, 213, 0);
    border-left-color: #295890;
    border-width: 10px;
    margin-top: -10px;
}

/*LP用テーブル*/
table.company2 {
	border:none;
	padding:10px 0 0 10;
}

table.company2 th {
    background: #295890;
    vertical-align: middle;
    text-align: left;
   width: 30%;
    overflow: visible;
    /* position: relative; */
    color: #fff;
    font-weight: bold;
    font-size: 16px;
		border-radius: 6px 6px 6px 6px;
	border-color: white;

}
table.company2 td {
   width: 70%;
    overflow: visible;
    /* position: relative; */
    color: #000;
    font-weight: bold;
    font-size: 16px;
	border:none;
			border-radius: 10px 10px 10px 10px;

}
/* firefox */
@-moz-document url-prefix() {
    table.company th::after {
        float: right;
        padding: 0;
        left: 30px;
        top: 10px;
        content: " ";
        height: 0;
        width: 0;
        position: relative;
        pointer-events: none;
        border: 10px solid transparent;
        border-left: #295890 10px solid;
        margin-top: -10px;
    }
}
 
table.company td {
    background: #f8f8f8;
    width: 360px;
    padding-left: 20px;
	font-size: 17px;
	
}
.box13 {
    padding: 0.5em 1em;
    margin: 2em 0;
    color: #FFF;
    background: #6eb7ff;
    border-bottom: solid 6px #3f87ce;
    box-shadow: 0 3px 6px rgba(0, 0, 0, 0.25);
    border-radius: 9px;
	font-size:20px;
}
.box13 p {
    margin: 0; 
    padding: 0;
}
.mybox{
    background-color: #fff;
    border: 2px solid #f3cbd0;
    border-radius: 5px;
    margin: 40px 5px 5px 20px;
    padding: 20px 20px 10px 20px;
    position: relative;
	font-size:16px;
	
}
.mybox:before{
    background-color: #ef858c;
    border-radius: 5px;
    color: #fff;
    content: '当サイトについて';
    padding: 5px 20px;
    position: absolute;
    left: -10px;
    top: -20px;
}
.mybox:after{
    border-top: 12px solid #ef858c;
    border-right: 12px solid transparent;
    border-left: 12px solid transparent;
    content: '';
    position: absolute;
    top: 10px;
    left: 15px;
}
.square_btn{
    display: inline-block;
    padding: 0.5em 1em;
    text-decoration: none;
    background: #668ad8;/*ボタン色*/
    color: #FFF;
    border-bottom: solid 4px #627295;
    border-radius: 3px;
}
.square_btn:active {/*ボタンを押したとき*/
    -ms-transform: translateY(4px);
    -webkit-transform: translateY(4px);
    transform: translateY(4px);/*下に動く*/
    box-shadow: 0px 0px 1px rgba(0, 0, 0, 0.2);/*影を小さく*/
    border-bottom: none;
}

#mobile_footer{
	display:none;
}
.cat-item > a{
	/*background-color:#87ceeb;*/
	font-weight:bold;
	font-size:16px;
}
.children .cat-item > a{
	background-color:inherit;
	font-weight:inherit;
}
@media screen and (max-width: 768px){
	.l-footer{
		padding-bottom: 50px;
	}
	#mobile_footer{
		display:block;
		width: 100%;
		height: 50px;
		background: #155d77;
		position: fixed;
		left: 0;
		bottom: -70px;
		letter-spacing: -.40em;
		z-index: 9999;
		text-align: center;
		font-size: 1.2rem;
		line-height: 1.2;
		color: #fff;
		font-weight: 700;
		box-shadow: 0px 0px 30px #fff, 0px 0px 30px #fff;
		-moz-box-shadow: 0px 0px 30px #fff, 0px 0px 30px #fff;
		-webkit-box-shadow: 0px 0px 30px #fff, 0px 0px 30px #fff;
		-webkit-transition: all .3s;
		transition: all .3s;
	}
	#mobile_footer.mobile_footer_active {
		bottom: 0;
	}
	#mobile_footer div{
		width: 25%;
		height: 50px;
		display: inline-block;
		letter-spacing: normal;
		padding-top: 15px;
		border-left: solid 1px #1f4451;
		position: relative;
		vertical-align:middle;
	}
	#mobile_footer div::before {
		width: 30px;
		height: 32px;
		font-family:"Font Awesome 5 Free";
		font-size:x-large;
		color:#ffd700;
		display: block;
		position: absolute;
		top: -17px;
		left: 50%;
		margin-left: -17px;
		background-repeat: no-repeat;
		background-position: center center;
		background-size: 30px auto;
		z-index: -1;
	}

	#mobile_footer div:first-child {
		border: none;
	}

	#mobile_footer a{
		text-decoration: none;
		color: #ffffff;
	}
	#menu-ranking::before{
		content: '\f27a';
	}
	#menu-find-job::before{
		content: '\f445';
	}
	#menu-menu::before{
		content: '\f00a';
	}
	#menu-top::before{
		content: '\f0aa';
	}
}

/*--------------------
 吹き出しを作る
--------------------*/
.balloon {
 margin: 40px 0;
 padding : 0 40px;
 position: relative;
}
.balloon:after,.balloon:before {
 clear: both;
 content: "";
 display: block;
}
.balloon-image-left {
 position: absolute;
 left: 0;
 margin: 0;
 width: 60px;
 height: 60px;
}
.balloon-image-right {
 position: absolute;
 right: 0;
 margin: 0;
 width: 60px;
 height: 60px;
}
.balloon figure img {
 width: 100%;
 height: 100%;
 border: 1px solid #aaa;
 border-radius: 50%;
 margin: 0;
}
.balloon-image-description {
 padding: 5px 0 0;
 font-size: 10px;
 text-align: center;
}
.balloon-text-right {
 position: relative;
 margin-left: 40px;
 padding: 10px;
 border: 1px solid #aaa;
 border-radius: 10px;
 float: left;
 max-width: 100%;
}
.balloon-text-left {
 position: relative;
 margin-right: 40px;
 padding: 10px;
 border: 1px solid #aaa;
 border-radius: 10px;
 float: right;
 max-width: 100%;
}
.balloon p {
 margin: 0 0 20px;
}
.balloon p:last-child {
 margin-bottom: 0;
}
/* 会話 */
.balloon-text-right:before {
 position: absolute;
 content: '';
 border: 10px solid transparent;
 border-right: 10px solid #aaa;
 top: 15px;
 left: -20px;
}
.balloon-text-right:after {
 position: absolute;
 content: '';
 border: 10px solid transparent;
 border-right: 10px solid #fff;
 top: 15px;
 left: -19px;
}
.balloon-text-left:before {
 position: absolute;
 content: '';
 border: 10px solid transparent;
 border-left: 10px solid #aaa;
 top: 15px;
 right: -20px;
}
.balloon-text-left:after {
 position: absolute;
 content: '';
 border: 10px solid transparent;
 border-left: 10px solid #fff;
 top: 15px;
 right: -19px;
}
/* 考え毎 */
.think .balloon-text-right,.think .balloon-text-left {
 border-radius: 30px;
}
.think .balloon-text-right:before {
 border: 1px solid #aaa;
 border-radius: 50%;
 width: 8px;
 height: 8px;
 top: 15px;
 left: -12px;
}
.think .balloon-text-right:after {
 border: 1px solid #aaa;
 border-radius: 50%;
 width: 4px;
 height: 4px;
 top: 20px;
 left: -19px;
}
.think .balloon-text-left:before {
 border: 1px solid #aaa;
 border-radius: 50%;
 width: 8px;
 height: 8px;
 top: 15px;
 right: -12px;
}
.think .balloon-text-left:after {
 border: 1px solid #aaa;
 border-radius: 50%;
 width: 4px;
 height: 4px;
 top: 20px;
 right: -19px;
}
/*カテゴリー幅*/
.widget ul li {
    position: relative;
    padding: 7px 0 0 20px;
    margin-bottom: 7px;
    border-top: dotted 1px #D8D8D8;
    line-height: 1.5;
}
/*目次装飾*/
#toc_container {
    background: #fffbf4;
    padding: 10px 20px 10px 10px;
    border: solid 3px #f89174;
    margin-bottom: 2em;
    margin-top: 10px;
}
/*囲み*/
.kakomi {
    white-space: nowrap;
    padding: 2px 4px 2px 4px;
    margin: 4px;
    width: 80%;
    color: #ffefef;
    font-weight: bold;
    font-size: 15px;
    border: solid 1px #ba3939;
    background: #ba3939;
    border-radius: 5px;
    box-shadow: 1px 1px 4px #999;
}