@charset "utf-8";

/** =========================================
* 
* Header Area
*
* bg-color : 
* font-color : 
* html-width : 960px
* hover-color: #ff3000
------ */
.wrapper {
	width: 100%;
	min-height: 100%;
	padding-bottom: 150px;
	border-bottom: none;
}

.menu-area-sp {
	background: #454545;
	width: 100%;
	position: absolute;
	z-index:100;
	box-shadow: 0 2px 10px #423d54;
	
	display: none;
}

.sp-margin {
	padding:1em 2em;
}

.header {
	width: 100%;
	height: auto;
}
.logo {
	position: absolute;
	display:inline-block;
	padding: 4.3% 3% 0;
	z-index: 100;
	/* display: none; */
}
.logo img {
	width: 80%;
	height: 80%;
}
.main-img {
	width: 100%;
}

/** メインメニュー */
.main-manu-base {
	width: 100%;
	border:none;
	background: none;
}
.main-manu-line {
	border:none;
}
.main-menu {
	width: 100%;
	margin: 0 auto;
	display: block;
	table-layout: none;
	border-collapse: none;
	border-left: none;
	border:1px solid #bbb;
	border-radius: 0.5em;
	position:relative;
	overflow:hidden;
	background: white;
	margin-bottom: 1em;
}
.main-menu li {
	width: 100%;
	display: block;
	border-right:none;
	border-bottom:1px solid #bbb;
}
.main-menu li:first-child {
	width: 100%;
}
.main-menu li:last-child {
	border-bottom: none;
}
.main-menu li a {
	display: block;
	text-decoration: none;
	font-weight: bold;
	color: #454545;
	text-align: left;
	padding:1em 0;
	text-shadow: none;
	font-size: 1em;
	padding-left:1.2em;
}

.main-menu li a:before {
	content:"▶";
	margin-right: 0.5em;
	font-size:0.9em;
	color: #f44d39;
}

/** エントリーボタンのコンテナ */
.btn-area-entry {
	width: 100%;
}

/** エントリーボタン */
.btn-entry, .btn-entry2 {

	position: static;
	
	width: 100%;
	border-radius: 0.5em;
	border: 1px solid #a11205;
	border-top: 1px solid #a11205;
	font-weight: bold;
	text-shadow:1px 1px 3px #300;
	margin-bottom:1em;
	
	background: none;
	
	background: -webkit-gradient(linear, left top, left bottom, color-stop(1.00, #a11205), color-stop(0.00, #cf2a0d));
	/* background: -webkit-linear-gradient(#cf2a0d, #a11205);
	background: -moz-linear-gradient(#cf2a0d, #a11205);
	background: -o-linear-gradient(#cf2a0d, #a11205);
	background: -ms-linear-gradient(#cf2a0d, #a11205);
	background: linear-gradient(#cf2a0d, #a11205); */
}
/* .btn-entry:hover , .btn-entry2:hover {
	background: #ff3000;
} */
.entry {
	display: block;
	text-align: left;
	text-decoration: none;
	color: white;
	border:1px solid #d97a6c;
	border-top: 1px solid #d97a6c;
	padding: 0.8em 0;
	border-radius: 0.5em;
	font-size:1.1em;
	padding-left:1em;
}
.entry:before {
	content: "▶";
	padding-right:0.5em;
	font-size:0.8em;
}
/* .entry:hover {
	text-decoration: none;
} */

.global-menu-header {
	display: block;
	font-size: 0.9em;
	color: white;
}

.global-menu-header li {
	border-bottom: 1px solid #bbb;
}

.global-menu-header li:first-child {
	padding: 1em 0;
}

.global-menu-header li a {
	display: block;
	padding: 1em 0;
	color: white;
}

.global-menu-header li a:before {
	content: "　";
	margin-right:5px;
	background:url(../img/icn_blank_mini.png) no-repeat 0% 50%;
	background-size: 90%;
}

/**  */
/* .sp-menu-container {
    height: 43px;
} */


/* .menu-sp {
	display: block;
	width: 100%;
	border:1px solid #ff9f00;
	border-width: 1px 0;
    position: static;
} */

.menu-sp {
	display: block;
	width: 100%;
    position: static;

	border-bottom:2px solid #ff6300;
/* 	border-width: 1px 0; */
	text-align: right;
	
	/* background: none;
	
	background: -webkit-gradient(linear, left top, left bottom, color-stop(1.00, #ff6300), color-stop(0.00, #ff9f00)); */
}

.menu-sp > span:first-child {
	display: inline-block;
	padding: 1.5% 1% 1%;
	margin: 1.5% 3% 1.5% 0;
	background: #eee;
	text-align:center;
	border-radius: 5px;
	border: 3px solid #eee;
	z-index:100;
}

/** ハンバーガーメニュー */
.menu-trigger,
.menu-trigger span {
	display: inline-block;
	transition: all .4s;
	/* margin:2% 5%; */
	z-index:100;
}
.menu-trigger {
	position: relative;
	width: 31px;
	height: 25px;
}
.menu-trigger span {
	position: absolute;
	border:2px solid #333;
	border-radius:2px;
	border-width:2px 16px 2px;
	/* left: 0;
	width: 100%;
	height: 4px;
	background-color: #fff;
	border-radius: 1px; */
}
.menu-trigger span:nth-of-type(1) {
	top: 0;
}
.menu-trigger span:nth-of-type(2) {
	top: 43%;
}
.menu-trigger span:nth-of-type(3) {
	bottom: 0;
}



/** =========================================
* Main contents
* 
* bg-color : 
* font-color : 
* 
------ */
.content-wrapper {
	width: 100%;
}

.align-right {
	width: 90%;
	margin:0 auto 20px;
	text-align: right;
}

article {
	padding:0 5%;
    overflow: hidden;
}

/** =========================================
* 中身
* 
* bg-color : 
* font-color : 
* 
------ */

/** パン屑 */
.breadcrumb {
	width:95%;
	margin:0 auto;
	font-size: 0.7em;
	padding: 3% 0;
	line-height:1.4;
}

.h1 {
	position: relative;
	overflow: visible;
	width: 110%;
	font-size: 1em;
	border:none;
	border-radius: 0;
	margin:0 -5%;
}

.h1 img {
	width: 100%;
}

.h1 img.sp-hidden {
	height: 30px;
}

.h1 h1 {
	position: absolute;
	top : 0.5em;
	left:0.5em;
	width:90%;
	line-height:1.4;
	font-size:1.1em;
}

.h1 p {
	position:static;
	font-weight: normal;
	font-size: 0.8em;
	width: 100%;
	line-height:1.5;
	padding: 0.5em 1em;
}

.h1 p.top90 {
	top: 110px;
}

.h1 img {
	display: block;
}

/* h2 {
    margin-top:1.5em;
    font-size: 0.95em;
    padding-bottom: 0.1em;
    border-bottom: 1px solid #bbb;
	line-height:1;
	position: relative;
}

h2 span {
	display: inline-block;
	line-height: 1.2;
	width: 92%;
	
	position: absolute;
	bottom: 5%;
}

h2:before {
    font-family: 'maru-go';
    content: "I";
    font-size: 2.5em;
    font-weight: 300;
    margin-right: 5px;
    color: #f44d39;
	
	vertical-align: middle;
} */


h2 {
	margin-top:1.5em;
	font-size: 0.95em;
	padding-bottom: 5px;
	border-bottom: 1px solid #bbb;
	line-height:1;
	position: relative;
}

h2 span {
	display: inline-block;
	line-height: 1.1;
	font-size: 0.95em;
	width: 92%;
	
	position: absolute;
	bottom: 5%;
}

h2:before {
    content: "";
		display: inline-block;
    vertical-align: -7px;
		width: 6px;
		height: 1.85em;
    margin-right: 13px;
    background: #f44d39;
		border-radius: 3px;
}

h3 {
    margin-top: 30px;
}

p {
    font-size: 0.9em;
    line-height: 1.8;
}

.mds-enclose {
	padding:3% 5% 2%;
	line-height: 1.3;
}

.mds-enclose2 {
	display: block;
	padding:0;
	margin-bottom:3%;
	line-height:1.4;
}

.mds-enclose2:before {
	content: none;
}

/** =========================================
* link list
* 
* bg-color : 
* 
------ */
.link-list-t3 li {
	display: block;
	padding-right: 15px;
	padding-bottom: 2%;
}

/** =========================================
* Footer
* 
* bg-color : 
* font-color : 
* 
------ */
.footer {
	width: 100%;
}
.global-menu-bg {
	width: 100%;
	padding: 1em 0 0.5em;
}
.site-map-menu-base {
	padding:1em 0;
}
.site-map-menu, .site-map-menu-base {
	width: 95%;
	/* border:1px solid red; */
}

.site-map-menu:first-child + * {
	margin-top:2%;
	margin-left:3%;
}

.site-map-menu li {
	display: inline-block;
	font-size: 0.6em;
	width: 55%;
	/* border:1px solid red; */ /*******************************************/
}
.site-map-menu li:nth-child(odd) {
	width: 45%;
}

.site-map-menu li a {
	display:inline-block;
	color: white;
	text-decoration: none;
	padding:8px 0;
}

.site-map-menu li:before {
	content: "▶";
	color: #f34d39;
	margin-right: 5px;
}

/* .site-map-menu li a:hover {
	text-decoration: underline;
} */

.global-menu {
	width: 90%;
}
.global-menu li {
	display: inline-block;
	font-size: 0.7em;
	/* border: 1px solid red; */	/****************************/
}
.global-menu li:first-child {
	display: block;
}

.global-menu li:first-child + *, .global-menu li:first-child + * + * + *, .global-menu li:first-child + * + * + * + * + * {
	width: 60%;
}
 
.global-menu li:first-child + * + * + *::before, .global-menu li:first-child + * + * + * + * + *::before {
	content:"　";
	display:block;
	font-size: 1px;
}
.global-menu li a {
	display: inline-block;
	padding:7px 0;
	text-decoration: none;
	color: #333;
}

.site-map-menu li.blank:before {
	content:none;
}

.global-menu li a:before, .site-map-menu li.blank a:before {
	content: "　";
	margin-right:5px;
	background:url(../img/icn_blank_mini.png) no-repeat 0% 50%;
	background-size: 90%;
}
.global-menu li b {
/* 	display: inline-block; */
	padding:0 0 10px 0;
}
/* .global-menu li a:hover {
	text-decoration: underline;
} */

.copyright {
	width: 95%;
	padding: 0;
	margin: 1em auto;
	color: white;
	font-family:Arial, Helvetica, sans-serif;
	
	clear:both;
	position: relative;
	overflow: hidden;
	zoom:1;
}

.copyright small {
	width: 60%;
	float: left;
	font-size: 0.6em;
}

.p-mark {
	position: static;
	float: right;
	width: 15%;
	border-radius: 5px;
	bottom: 0;
	right: 0;
}

.site-map-menu li.blank:before {
	margin-right: -1px;
}

.icn-pc::after {
	content:url(../img/icn_4pc.svg);
	margin-left: 10px;
	/* width: 15px; */
	zoom: 0.7;
}

.icn-pc2 {
	position: relative;	
}
.icn-pc2::after {
	content:url(../img/icn_4pc_black.svg);
	margin-left: 5px;
	zoom: 1.2;
	position: absolute;
	top:30%;
}

/** =========================================
* column pattern
* 
* bg-color : 
* 
------ */
/** 3 column */
.column-wrapper, .column-wrapper-t1 {
    width: 100%;
    display: block;
    vertical-align: top;
}

.column-wrapper-sp {
	/* スマフォ用対応： */
	display: -webkit-flex;
	display: flex;
	/* 逆順表示 */
	-webkit-flex-direction: column-reverse;
	flex-direction: column-reverse;
}

.column-wrapper-t1 {
    margin: 0;
    border-collapse: separate;
    border-spacing: 0;
}
.three-column {
    width: 100%;
    display: block;
    /* padding: 1px; */
    border: 1px solid #bbb;
    border-radius: 3px;
    overflow: hidden;
	vertical-align: top;
}


.border-btm1px {
	width: 100%;
}

/** インデックス用3コラム表示：少し横幅が狭くなる */
.column-wrapper-t1 .three-column {
    width: 90%;
	vertical-align: top;
	margin: 1em auto;
}

.three-column img {
    display: block;
}
.three-column p {
    margin: 17px;
}

.two-column {
    width: 50%;
    display: table-cell;
}

.blank {
    width: 15px;
	/*display: none;*/
}

/** 2 column for layout */
.aside {
    width: 90%;
    display: block;
	margin:0 auto;
	/*float: right;*/
    vertical-align: top;
	
	-webkit-box-ordinal-group: 2;
}
.content {
	width: 100%;
	/*float: left;*/
    display: block;
}

.two-column-t2.sp-pattern {
    width: 100%;
    display: block;
    position: relative;
    overflow: hidden;
    background: #ededed;
    border-radius: 5px;
}

.center-column.sp-pattern {
	width: 100%;
    display: block;
}

.sp-columns {
	display: flex;
	display: -webkit-flex;
    
    -webkit-flex-direction: column;
    flex-direction: column;
}

.sp-columns  {
    width: 100%;
}





/** botton : default */
.btn, .btn2, .btn3 a span {
    border: 1px solid #bbb;
    border-width: 1px 0;
    
    background: none;
	
	background: -webkit-gradient(linear, left top, left bottom, color-stop(1.00, #e7e7e7), color-stop(0.00, #ffffff));
/* 	background: -webkit-linear-gradient(#ffffff, #e7e7e7);
	background: -moz-linear-gradient(#ffffff, #e7e7e7);
	background: -o-linear-gradient(#ffffff, #e7e7e7);
	background: -ms-linear-gradient(#ffffff, #e7e7e7);
	background: linear-gradient(#ffffff, #e7e7e7); */
}
.btn2 {
    border-width: 1px;
    border-radius: 5px;
}
.btn3 {
	border-top: none;
}

/* .btn:hover, .btn2:hover, .btn3:hover span {
	background: url(../img/menu-bg-main_ovr.png) repeat-x left center;
	
	background: -webkit-gradient(linear, left top, left bottom, color-stop(1.00, #ffe5c7), color-stop(0.00, #ffffff));
	background: -webkit-linear-gradient(#ffffff, #ffe5c7);
	background: -moz-linear-gradient(#ffffff, #ffe5c7);
	background: -o-linear-gradient(#ffffff, #ffe5c7);
	background: -ms-linear-gradient(#ffffff, #ffe5c7);
	background: linear-gradient(#ffffff, #ffe5c7);
} */
.btn a, .btn2 a, .btn3 a span {
    display: block;
    padding: 13px 0 10px 15px;
    color: #333;
    font-weight: bold;
    font-size: 1.1em;
}
.btn3 a span {
	border-top: 1px solid #bbb;
}
/* .btn a:hover, .btn2 a:hover, .btn3 a:hover {
    color: #f44d39;
    text-decoration: none;
} */
.btn a:before, .btn2 a:before, .btn3 a span:before {
    content: "▶";
	color: #f44d39;
    font-size: 0.8em;
    margin-right: 5px;
    vertical-align: middle;
}

/** 塗足し */
.coating-margin {
	background: #e7e7e7;
}

/** ボタン2 */
.btn-anchor {
	display: block;
	width: 100%;;
	line-height: 3.3em;
	height: 3.3em;
	border:1px solid #bbb;
	border-radius: 5px;
	text-align: center;
	margin-left: 0;
	box-shadow: none;
	margin-bottom: 5%;
	color: #333;
	font-weight: bold;
	
}

.btn-anchor.bg1 {
	background: url(../knowledge/img/btn-bg1.png) no-repeat center center / cover;
}

.btn-anchor.bg2 {
	background: url(../knowledge/img/btn-bg2.png) no-repeat center center / cover;
}

.btn-anchor.bg3 {
	background: url(../knowledge/img/btn-bg3.png) no-repeat center center / cover;
}


/** botton base */
.btn-default {
	display: block;
	width: 85%;
	margin: 0 auto;
	text-align: center;
	font-size: 1em;
	font-weight: bold;
	padding: 0.7em 0;
	border:1px solid #bbb;
	border-radius:0.5em;
	color: #454545;
	
	background: -webkit-gradient(linear, left top, left bottom, color-stop(1.00, #e8e8e8), color-stop(0.00, #fff));
/*	background: -webkit-linear-gradient( #ff00ff, #e8e8e8);
 	background: -moz-linear-gradient(#fff, #e8e8e8);
	background: -o-linear-gradient(#fff, #e8e8e8);
	background: -ms-linear-gradient(#fff, #e8e8e8);
	background: linear-gradient(top, #fff, #e8e8e8); */
}

.btn-default2 {
	width: 30%;
	position: relative;
	right: 0;
	margin-left: 70%;
}

/** ページ上部へもどる */
.upper-btn-container {
	width: 100%;
	height:70px;
	
	margin-top: -1em;
	/*border: 1px solid red;*/	/**********************************/
}

.anchor img {
	width: 15%;
}

/** */
.pc-btn {
	width: 95%;
	
	display: block;
	margin: 1em auto;
	text-align: center;
	font-size: 1em;
	font-weight: bold;
	padding: 0.7em 0;
	border:1px solid #bbb;
	border-radius:0.5em;
	color: #454545;
	
	background: -webkit-gradient(linear, left top, left bottom, color-stop(1.00, #e8e8e8), color-stop(0.00, #fff));
}

.pc-btn span {
	display: inline-block;
	vertical-align: top;
}

.pc-btn span::before {
	content:url(../img/icn_4pc_red.svg);
	margin:5px 10px 0 0;
}

.catalog {
	width: 100%;
}

.catalog li {
    display: inline-block;
    text-align: center;
    font-size: 0.8em;
	width: 100%;
    margin-left: 0;
    padding-bottom: 1em;
}

.catalog li img {
	width: 100%;
    height: 100%;
}

/** =========================================
* Table suite
* 
* 
------ */
.sp-table1 {
    width:  100%;
	border-spacing: 0;
}

.sp-table1 tr:first-child {
	display: none;
}

.sp-table1 tr {
    display: -webkit-flex;
	display: flex;
    
    -webkit-flex-direction: column;
	flex-direction: column;
    
    margin-top: 1px;
}

.sp-table1 tr td {
    width:  100%;
    display:  block;
    /*border: 1px solid red;*/
    text-align: left;
    padding: 2% 0;
}

.sp-table1 tr td:first-child::before {
    content: "【年齢】";
    font-weight: bold;
}

.sp-table1 tr td:first-child + *::before {
    content: "【役職】";
    font-weight: bold;
}

.sp-table1 tr td:first-child + * + *::before {
    content: "【月額固定給】";
    font-weight: bold;
}

.sp-table1 tr td:first-child + * + * + *::before {
    content: "【年収試算】";
    font-weight: bold;
}


.sp-table2, .sp-table3 { 
    display: -webkit-flex;
    display: flex;
    
    -webkit-flex-direction: row;
    flex-direction: row;
    
     background: transparent;
    border:1px solid #eee;
    border-width: 0 0 0 1px;
}

.sp-table2 tr, .sp-table3 tr {
    display: -webkit-flex;
    display: flex;
    
    -webkit-flex-direction: column;
    flex-direction: column;
    width: 95px;
    float: left;
    /*border-right: 1px solid #eee;*/
}

.sp-table3 tr {
    width: 75px;
}

.sp-table2 tr td, .sp-table2 tr th, .sp-table3 tr td, .sp-table3 tr th {
    display: block;
    width: 100%;
    border: 1px solid #eee;
    border-width: 0 1px 1px 0;
}

.sp-table2 tr th, .sp-table3 tr th {
    border-top: 1px solid #eee;
}

.sp-table3 tr th {
    border-top: none;
}


/** ▼ */
.triangle {
    /*border-color: #bbbbbb transparent transparent;
    border-style: solid;
    border-width: 25px 30px;
    height: 0;*/
    margin: 1em auto -0.7em;
    /*width: 0;*/
}

/** ===========================
* System.html
*
*/
.enclose-t2 {
    width: 100%;
    padding: 5%;
}

.system-img {
    display: block;
    margin: 15px auto;
    width: 65%;
    height: 65%;
}

.capital-5:before, .capital-6:before, .capital-7:before, .capital-8:before {
    content: "●";
    margin-right: 3px;
}

.capital-5:before {
    color: #68ad2f;
}

.capital-6:before {
    color: #d1701b;
}

.capital-7:before {
    color: #d68c2b;
}

.capital-8:before {
    color: #d69938;
}

.training-list li {
    color: #333333;
    float: left;
    height: 3em;
    line-height: 3em;
    width: 43.5%;
    font-size: 0.7em;
}

/** =========================================
* utility
* 
* bg-color : 
* 
------ */
.mgn-btm-1em {
	margin-bottom: 1em;
}

.sp-visible {
	display: block;
}

.sp-hidden {
	display: none;
}
.mgn-top30px {
	margin-top: 1em;
}
.w870px {
	width:95%;
	border:1px solid red;
}
.w66p {
	width: 100%;
}

.sp-mgn-top0 {
	margin-top: 0.5em;
}

.sp-mgn-top1 {
	margin-top: 5%;
}

.sp-mgn-top00 {
	margin-top: 0;
}

.mobile-visible {
		display: none;
}

.border-none {
	border: none;
}

.sp-box {
	display: flex;
	flex-direction: column;
}

.btn2.w160px {
	width: 100%;
	margin-bottom: 5%;
}

.btn3 a img {
	width: 100%;
}

.side-menu-t2 li a img {
	display: none;
}

.side-menu-t2 li {
    border-top: none;
}

.side-menu-t2 li a span {
	border-top: 1px dotted #bbb;
}

.line-h1_5em {
	font-size: 0.8em;
    line-height: 1.5;
}

.indent1 li {
	text-indent: -1.3em;
	padding-left: 1.32em;
}

.sp1 img {
	width: 100%;
	height: 100%;
	display: block;
	margin: 3% auto;
}

.sp-w90p {
	width: 90%;
	margin: 0 auto;
}

.sp-w100p {
	width: 100%;
}

.sp-direction {
	/* スマフォ用対応： */
	display: -webkit-flex;
	display: flex;
	/* 逆順表示 */
	-webkit-flex-direction: column-reverse;
	flex-direction: column-reverse;
}

.include-img span, .include-img em {
	display: block;
}

.include-img span {
	margin: 3% auto;
}

.sp-brank-top {
	position: relative;
	overflow: hidden;
	z-index: 35;
	margin-top: 7%;
}

.btn2.w150px {
	width: 100%;
	margin-bottom: 5%;
}

.btn2.w150px:last-child {
	margin-bottom: 0;
}

.sp-list1 {
	font-size: 0.9em;
	line-height: 1.5;
}

.spW {
    width: 100%;
}

.pc-icn {
	
}