@charset "utf-8";
/* CSS Document */

/* //////////////////////////////////////////////////////////
Component
////////////////////////////////////////////////////////// */


/* clearfix - micro clearfix
--------------------------------------------------------- */
/* ----- For modern browsers ----- */
.clearfix:before,
.clearfix:after {
    content:"";
    display:table;
}
 
.clearfix:after {
    clear:both;
}

/* ----- For IE 6/7 (trigger hasLayout)----- */
.clearfix {
    zoom:1;
}


/* float
--------------------------------------------------------- */
.float-r {
	float: right;
}
.float-l {
	float: left;
}
.inline-block {
	letter-spacing:-0.4em;/* inline-block Hack */
}
.inline-block > * {
	display: inline-block;
	letter-spacing: normal;/* inline-block Hack */
	*display: inline;/* inline-block Hack forIE */
	*zoom: 1;/* inline-block Hack forIE */
	vertical-align: top;
}
.inline-block > * a {
	display: block;
}


/* display
--------------------------------------------------------- */
.display-none {
	display: none !important;
}
.display-block {
	display: block !important;
}
.display-inline-block {
	display: inline-block !important;
}
.display-tr {
	display: table-row !important;
}
.display-td {
	display: table-cell !important;
}

/* 非表示
--------------------------------------------------------- */
.hidden {
	display: none !important;
}

/* 初期表示で非表示にする場合はこのクラスを使用する */
.hide {
	display: none !important;
}


/* border
--------------------------------------------------------- */
.border-0 {
	border: 0;
}
.border-l-0 {
	border-left: 0;
}
.border-r-0 {
	border-right: 0;
}
.border-t-0 {
	border-top: 0;
}
.border-b-0 {
	border-bottom: 0;
}
.border-top {
	border-top: 1px solid #ccc;
}
.border-bottom {
	border-bottom: 1px solid #ccc;
}


/* text-align
--------------------------------------------------------- */
.text-r { text-align: right !important; }
.text-l { text-align: left !important; }
.text-c { text-align: center !important; }


.text_left { text-align: left !important; }
.text_right { text-align: right !important; }
.text_center { text-align: center !important; }
.text_nowrap { white-space: nowrap !important; }




/* フォントサイズ - px
--------------------------------------------------------- */
.font-size-10px { font-size: 10px; }
.font-size-11px { font-size: 11px; }
.font-size-13px { font-size: 12px; }
.font-size-14px { font-size: 14px; }
.font-size-16px { font-size: 16px; }
.font-size-18px { font-size: 18px; }

.font-size-85p { font-size: 85%; }
.font-size-90p { font-size: 90%; }
.font-size-95p { font-size: 95%; }
.font-size-100p { font-size: 100%; }
.font-size-110p { font-size: 110%; }
.font-size-120p { font-size: 120%; }
.font-size-130p { font-size: 130%; }
.font-size-140p { font-size: 140%; }
.font-size-150p { font-size: 150%; }
.font-size-160p { font-size: 160%; }
.font-size-170p { font-size: 170%; }
.font-size-180p { font-size: 180%; }

.small {
	font-size: 80%;
}
.big {
	font-size: 130%;
	font-weight: inherit;
}


/* 文字装飾
--------------------------------------------------------- */
.text-strike {
	text-decoration: line-through;
}
.text-bold {
	font-weight: bold;
}
strong,
.strong {
	font-weight: bold;
}



/* table
--------------------------------------------------------- */
th,
td {
	border-collapse: collapse;
	border: 1px solid #ccc;
	padding: 4px 10px;
	background: #fff;
	text-align: left;
}
th {
	font-weight: bold;
	background-color: #f6f6f6;
}
.sprite tr:nth-child(even) td {
	background-color: #f6f6f6;
}


/* vertical-align
--------------------------------------------------------- */
.v-top {
	vertical-align: top;
}
.v-bottom {
	vertical-align: bottom;
}
.v-middle {
	vertical-align: middle;
}


/* margin / padding
--------------------------------------------------------- */
.m0auto { margin: 0 auto;}

.mt-10 { margin-top: -10px; }
.mt0 { margin-top: 0px; }
.mt5 { margin-top: 5px; }
.mt10 { margin-top: 10px; }
.mt15 { margin-top: 15px; }
.mt20 { margin-top: 20px; }
.mt25 { margin-top: 25px; }
.mt30 { margin-top: 30px; }
.mt40 { margin-top: 40px; }
.mt50 { margin-top: 50px; }
.mt60 { margin-top: 60px; }
.mt70 { margin-top: 70px; }
.mt80 { margin-top: 80px; }
.mt90 { margin-top: 90px; }
.mt100 { margin-top: 100px; }


.mb0 { margin-bottom: 0px; }
.mb5 { margin-bottom: 5px; }
.mb10 { margin-bottom: 10px; }
.mb15 { margin-bottom: 15px; }
.mb20 { margin-bottom: 20px; }
.mb25 { margin-bottom: 25px; }
.mb30 { margin-bottom: 30px; }
.mb40 { margin-bottom: 40px; }
.mb50 { margin-bottom: 50px; }
.mb60 { margin-bottom: 60px; }
.mb70 { margin-bottom: 70px; }
.mb80 { margin-bottom: 80px; }
.mb90 { margin-bottom: 90px; }
.mb100 { margin-bottom: 100px; }

.ml0auto { margin-left: auto;}
.ml0 { margin-left: 0px; }
.ml5 { margin-left: 5px; }
.ml10 { margin-left: 10px; }
.ml15 { margin-left: 15px; }
.ml20 { margin-left: 20px; }
.ml25 { margin-left: 25px; }
.ml30 { margin-left: 30px; }
.ml40 { margin-left: 40px; }
.ml50 { margin-left: 50px; }
.ml60 { margin-left: 60px; }
.ml70 { margin-left: 70px; }
.ml80 { margin-left: 80px; }
.ml90 { margin-left: 90px; }
.ml100 { margin-left: 100px; }

.mr0auto { margin-right: auto;}
.mr0 { margin-right: 0px; }
.mr5 { margin-right: 5px; }
.mr10 { margin-right: 10px; }
.mr15 { margin-right: 15px; }
.mr20 { margin-right: 20px; }
.mr25 { margin-right: 25px; }
.mr30 { margin-right: 30px; }
.mr40 { margin-right: 40px; }
.mr50 { margin-right: 50px; }
.mr60 { margin-right: 60px; }
.mr70 { margin-right: 70px; }
.mr80 { margin-right: 80px; }
.mr90 { margin-right: 90px; }
.mr100 { margin-right: 100px; }


.pt0 { padding-top: 0px; }
.pt5 { padding-top: 5px; }
.pt10 { padding-top: 10px; }
.pt15 { padding-top: 15px; }
.pt20 { padding-top: 20px; }
.pt25 { padding-top: 25px; }
.pt30 { padding-top: 30px; }
.pt40 { padding-top: 40px; }
.pt50 { padding-top: 50px; }
.pt60 { padding-top: 60px; }
.pt70 { padding-top: 70px; }
.pt80 { padding-top: 80px; }
.pt90 { padding-top: 90px; }
.pt100 { padding-top: 100px; }

.pb0 { padding-bottom: 0px; }
.pb5 { padding-bottom: 5px; }
.pb10 { padding-bottom: 10px; }
.pb15 { padding-bottom: 15px; }
.pb20 { padding-bottom: 20px; }
.pb25 { padding-bottom: 25px; }
.pb30 { padding-bottom: 30px; }
.pb40 { padding-bottom: 40px; }
.pb50 { padding-bottom: 50px; }
.pb60 { padding-bottom: 60px; }
.pb70 { padding-bottom: 70px; }
.pb80 { padding-bottom: 80px; }
.pb90 { padding-bottom: 90px; }
.pb100 { padding-bottom: 100px; }

.pl0 { padding-left:0px; }
.pl5 { padding-left:5px; }
.pl10 { padding-left:10px; }
.pl15 { padding-left:15px; }
.pl20 { padding-left:20px; }
.pl25 { padding-left:25px; }
.pl30 { padding-left:30px; }
.pl40 { padding-left:40px; }
.pl50 { padding-left:50px; }
.pl60 { padding-left:60px; }
.pl70 { padding-left:70px; }
.pl80 { padding-left:80px; }
.pl90 { padding-left:90px; }
.pl100 { padding-left:100px; }

.pr0 { padding-right:0px; }
.pr5 { padding-right:5px; }
.pr10 { padding-right:10px; }
.pr15 { padding-right:15px; }
.pr20 { padding-right:20px; }
.pr25 { padding-right:25px; }
.pr30 { padding-right:30px; }
.pr40 { padding-right:40px; }
.pr50 { padding-right:50px; }
.pr60 { padding-right:60px; }
.pr70 { padding-right:70px; }
.pr80 { padding-right:80px; }
.pr90 { padding-right:90px; }
.pr100 { padding-right:100px; }



/* width
--------------------------------------------------------- */
.w0 { width:0px; }
.w0 { width:0px; }
.w5 { width:5px; }
.w10 { width:10px; }
.w15 { width:15px; }
.w20 { width:20px; }
.w25 { width:25px; }
.w30 { width:30px; }
.w35 { width:35px; }
.w40 { width:40px; }
.w45 { width:45px; }
.w50 { width:50px; }
.w55 { width:55px; }
.w60 { width:60px; }
.w65 { width:65px; }
.w70 { width:70px; }
.w75 { width:75px; }
.w80 { width:80px; }
.w85 { width:85px; }
.w90 { width:90px; }
.w95 { width:95px; }
.w100 { width:100px; }
.w150 { width:150px; }
.w200 { width:200px; }
.w250 { width:250px; }
.w300 { width:300px; }
.w350 { width:350px; }
.w400 { width:400px; }
.w450 { width:450px; }
.w500 { width:500px; }
.w550 { width:550px; }
.w600 { width:600px; }



/* =========================================================
必須マーク、エラーメッセージ、アラートメッセージ
========================================================= */

/* 必須 */
.required:after {
	content: "必須";
	background: #cf646b;
	color: #fff;
	padding: 0 10px;
	margin: 0 0 0 5px;
	font-weight: normal;
	font-size: 0.9em;
	border-radius: 3px;
	float: right;
	min-width: 2em;
	text-align: center;
}

/* 条件付き必須 */
.required_condition:after {
	content: "※";
	background: #317dcb;
	color: #fff;
	padding: 0 10px;
	margin: 0 0 0 5px;
	font-weight: normal;
	font-size: 0.9em;
	border-radius: 3px;
	float: right;
	min-width: 2em;
	text-align: center;
}

/* エラーメッセージ、アラートメッセージ */
.alertMsg,
.errorMessage {
	display: block;
	color: #e30011;
	margin-top: 5px;
	font-size: 90%;
}
.alertMsg + * {
	margin-top: 5px;
}






/* =========================================================
カラム分け
========================================================= */

/* カラム分け（汎用）
--------------------------------------------------------- */
.wrap_parent {
	display: table !important;
	width: 100%;
}
/* ----- 二分割 ----- */
.left_wrap {
	display: table-cell;
	padding-right: 15px;
	width: 50%;
	vertical-align: top;
}
.right_wrap {
	display: table-cell;
	padding-left: 15px;
	width: 50%;
	vertical-align: top;
}
/* ----- 三分割 ----- */
.wrap_parent_3 {
	display: table !important;
	width: 102%;
	margin-left: -1%;
}
.part_wrap_3 {
	display: table-cell;
	padding-left: 1%;
	padding-right: 1%;
	width: 33.333%;
	vertical-align: top;
}
/* ----- 四分割 ----- */
.wrap_parent_4 {
	display: table !important;
	width: 102%;
	margin-left: -1%;
}
.part_wrap_4 {
	display: table-cell;
	padding-left: 1%;
	padding-right: 1%;
	width: 25%;
	vertical-align: top;
}


/* カード型
--------------------------------------------------------- */
.card_wrap {
	display: block !important;
	width: 100%;
	letter-spacing:-0.4em;/* inline-block Hack */
}
.card_shadow {
	box-shadow: 2px 6px 8px rgba(0,0,0,0.1);
}
.card_wrap .card_part {
	display: inline-block;
	letter-spacing: normal;/* inline-block Hack */
	*display: inline;/* inline-block Hack forIE */
	*zoom: 1;/* inline-block Hack forIE */
}
/* ----- 二分割 ----- */
.card_wrap_2 .card_part {
	width: 50%;
	vertical-align: top;
}
/*
.card_wrap_2 .card_part:nth-child(odd) .card_part_inner {
	margin-left: 0;
}
.card_wrap_2 .card_part:nth-child(even) .card_part_inner {
	margin-right: 0;
}
*/
.card_wrap_2 .card_part_inner {
	margin-left: 16px;
	margin-right: 16px;
	/*background: #efefef;/*検証用*/
	padding: 16px;
}
/* ----- 三分割 ----- */
.card_wrap_3 .card_part {
	width: 33.333%;
	vertical-align: top;
}
/*
.card_wrap_3 .card_part:first-child .card_part_inner {
	margin-left: 0;
}
.card_wrap_3 .card_part:nth-child(3n) .card_part_inner {
	margin-right: 0;
}
*/
.card_wrap_3 .card_part_inner {
	margin-left: 16px;
	margin-right: 16px;
	/*background: #efefef;/*検証用*/
	padding: 16px;
}
/* ----- 四分割 ----- */
.card_wrap_4 .card_part {
	width: 25%;
	vertical-align: top;
}
/*
.card_wrap_4 .card_part:first-child .card_part_inner {
	margin-left: 0;
}
.card_wrap_4 .card_part:nth-child(4n) .card_part_inner {
	margin-right: 0;
}
*/
.card_wrap_4 .card_part_inner {
	margin-left: 16px;
	margin-right: 16px;
	/*background: #efefef;/*検証用*/
	padding: 16px;
}
/* ----- 五分割 ----- */
.card_wrap_5 .card_part {
	width: 20%;
	vertical-align: top;
}
/*
.card_wrap_5 .card_part:first-child .card_part_inner {
	margin-left: 0;
}
.card_wrap_5 .card_part:nth-child(5n) .card_part_inner {
	margin-right: 0;
}
*/
.card_wrap_5 .card_part_inner {
	margin-left: 16px;
	margin-right: 16px;
	/*background: #efefef;/*検証用*/
	padding: 16px;
}

/* ----- サイズ固定 ----- */
.card_wrap_320 .card_part {
	max-width: 360px;
	vertical-align: top;
	margin: 8px;
	padding: 8px;
}
.card_wrap_320 .card_part:nth-child(-n+3){
	margin-top: 0;
}
.card_wrap.card_wrap_320 {
	display: block !important;
	margin: 0 auto;
	width: 100%;
}
/*tablet*/
@media screen and (min-width: 701px) and (max-width: 1020px) {
	.card_wrap .card_part,
	.tile_wrap .tile_part,
	.card_wrap_320 .card_part {
		width: 48%;
		margin: 0 auto;
	}
}
/*sp*/
@media screen and (max-width: 700px) {
	.card_wrap .card_part,
	.tile_wrap .tile_part,
	.card_wrap_320 .card_part {
		width: 100%;
		display: block;
		margin: 0 auto;
	}
	.card_wrap .card_part {
		margin: 16px auto;
	}
}


/* タイル型
--------------------------------------------------------- */
.tile_wrap {
	display: table !important;
	width: 100%;
}
/* ----- 二分割 ----- */
.tile_wrap_2 .tile_part {
	display: table-cell;
	width: 50%;
	vertical-align: top;
}
.tile_wrap_2 .tile_part_inner {
	margin-left: 0;
	margin-right: 0;
	/*background: #efefef;/*検証用*/
	/*border: 1px solid #ddd;/*検証用*/
	padding: 16px;
}
/* ----- 三分割 ----- */
.tile_wrap_3 .tile_part {
	display: table-cell;
	width: 33.333%;
	vertical-align: top;
}
.tile_wrap_3 .tile_part_inner {
	margin-left: 0;
	margin-right: 0;
	/*background: #efefef;/*検証用*/
	/*border: 1px solid #ddd;/*検証用*/
	padding: 16px;
}
/* ----- 四分割 ----- */
.tile_wrap_4 .tile_part {
	display: table-cell;
	width: 25%;
	vertical-align: top;
}
.tile_wrap_4 .tile_part_inner {
	margin-left: 0;
	margin-right: 0;
	/*background: #efefef;/*検証用*/
	/*border: 1px solid #ddd;/*検証用*/
	padding: 16px;
}
/* ----- 五分割 ----- */
.tile_wrap_5 .tile_part {
	display: table-cell;
	width: 20%;
	vertical-align: top;
}
.tile_wrap_5 .tile_part_inner {
	margin-left: 0;
	margin-right: 0;
	/*background: #efefef;/*検証用*/
	/*border: 1px solid #ddd;/*検証用*/
	padding: 16px;
}






/* =========================================================
ボタン
========================================================= */

.btn {
	border-radius: 40px;
	height: 40px;
	padding: 8px 48px;
	display: block;
	background: #283F68;
	color: #fff;
	font-weight: normal;
	text-decoration: none;
	opacity: 0.75;

	display: inline-block;
	letter-spacing: normal;/* inline-block Hack */
	*display: inline;/* inline-block Hack forIE */
	*zoom: 1;/* inline-block Hack forIE */
}
.btn-o {
	background: #fff;
	color: #283F68;
	font-weight: bold;
	border: 2px solid #283F68;
}
.btn:hover {
	opacity: 1;
}
.btn:before {
	font-family: "FontAwesome";
	font-size: 1.2em;
	padding: 0;
	font-weight: normal;
	position: relative;
	vertical-align: middle;

    display: inline-block;
    font-feature-settings: normal;
    font-kerning: auto;
    font-language-override: normal;
    font-size-adjust: none;
    font-stretch: normal;
    font-style: normal;
    font-synthesis: weight style;
    font-variant: normal;
    font-weight: normal;
    line-height: 1;
    text-rendering: auto;
    transform: translate(0px, 0px);
	
	left: -8px;
	top: -0.1em;
	width: 18px;
	text-align: center;
	
	content: "\f061";
}
.btn-tawara {
	border-radius: 48px;
	height: 48px;
	padding: 14px 42px;
	display: block;
}
.btn-contact {
	background: #283F68;
	color: #fff;
}

.btn.more {
	float: right;
	margin-left: 16px;
	margin-right: 16px;
}
/*tablet*/
@media screen and (min-width: 701px) and (max-width: 1020px) {
}
/*sp*/
@media screen and (max-width: 700px) {
	.btn {
		border-radius: 60px;
		width: 80%;
		float: none;
		/*height: 60px;*/
		margin: 16px auto;
		padding: 0.5em;
	}
	.btn:before {
		width: auto;
		margin-right: 0.1em;
	}
	.btn.more {
		float: none;
	}
}



/* =========================================================
カラー
========================================================= */

/* テキストのカラー
--------------------------------------------------------- */
.color-orange {
	color: #D58100;
}
.color-blue {
	color: #005EAE;
}
.color-green {
	color: #009A59;
}
.color-red {
	color: #E60019;
}
.color-purple {
	color: #920783;
}
.color-eltexnavy {
	color: #283F68;
}
.color-eltexred {
	color: #E7241D;
}


/* 背景のカラー
--------------------------------------------------------- */
.bg-orange {
	background: #D58100;
}
.bg-blue {
	background: #005EAE;
}
.bg-green {
	background: #009A59;
}
.bg-red {
	background: #E60019;
}
.bg-purple {
	background: #920783;
}
.bg-eltexnavy {
	background: #283F68;
}
.bg-eltexred {
	background: #E7241D;
}


.bg-white {
	background: #fff;
}
.bg-pgray {
	background: #f4f5f5;
}


/*
水色の候補
#00A1D3

ピンクの候補
#E57393

*/


/* =========================================================
見出し
========================================================= */
.h {
}
.h .icon {
}

.h1 {
  font-size: 2em;
  margin-bottom: 1em;
  font-weight: 900;
}
.h2 {
  font-size: 1.8em;
  margin-bottom: 1em;
  font-weight: 900;
}
.h3 {
  font-size: 1.5em;
  margin-bottom: 0.8em;
  font-weight: 700;
}
.h4 {
  font-size: 1.2em;
  margin-bottom: 0.5em;
  font-weight: 700;
}
.h5 {
  font-size: 1em;
  margin-bottom: 0.5em;
  font-weight: 500;
}

.h-border-bottom {
	border-bottom: 2px solid #000;
	padding: 4px;
	display: inline-block;
}
/*tablet*/
@media screen and (min-width: 701px) and (max-width: 1020px) {
.h1 {
  font-size: 2em;
  margin-bottom: 3em;
  font-weight: 900;
}
.h2 {
  font-size: 1.8em;
  margin-bottom: 2.5em;
  font-weight: 900;
}
.h3 {
  font-size: 1.5em;
  margin-bottom: 2em;
  font-weight: 700;
}
.h4 {
  font-size: 1.2em;
  margin-bottom: 1.8em;
  font-weight: 700;
}
.h5 {
  font-size: 1em;
  margin-bottom: 1.5em;
  font-weight: 500;
}

.h-border-bottom {
	border-bottom: 2px solid #000;
	padding: 4px;
	display: inline-block;
}
}
/*sp*/
@media screen and (max-width: 700px) {
.h1 {
  font-size: 1.5em;
  margin-bottom: 1em;
  font-weight: 900;
}
.h2 {
  font-size: 1.3em;
  margin-bottom: 1em;
  font-weight: 900;
}
.h3 {
  font-size: 1.2em;
  margin-bottom: 1em;
  font-weight: 700;
}
.h4 {
  font-size: 1.1em;
  margin-bottom: 1em;
  font-weight: 700;
}
.h5 {
  font-size: 1em;
  margin-bottom: 1em;
  font-weight: 500;
}

.h-border-bottom {
	border-bottom: 2px solid #000;
	padding: 4px;
	display: inline-block;
}
}


/* =========================================================
段落
========================================================= */

p {
	margin-bottom: 2em;
}





/* =========================================================
グローバルメニュー
========================================================= */

/* ----- globalNav ----- */
header .globalNav {
	width: 100%;
	height: 72px;
	position: relative;
	top: 82px;
}
header .globalNav ul {
	display: table;
}
header .globalNav li {
	display: table-cell;
	height: 72px;
	vertical-align: middle;
	margin: 0 16px;
}
header .globalNav li .menu_block {
	display: block;	
	margin: 0 8px;
}
header .globalNav li a {
	display: table-cell;
	height: 72px;
	text-decoration: none;
	font-size: 14px;
	padding: 0 16px;
	vertical-align: middle;
	color: #333;
	font-weight: 500;
}
header .globalNav li:first-child a {
	margin-left: 0;
}
/* ----- hoverで線を動かす----- */
/* Underline From Center /* Underline From Center */
.hvr-underline-from-center,
header .globalNav li a {
	vertical-align: middle;
	-webkit-transform: translateZ(0);
	transform: translateZ(0);
	box-shadow: 0 0 1px rgba(0, 0, 0, 0);
	-webkit-backface-visibility: hidden;
	backface-visibility: hidden;
	-moz-osx-font-smoothing: grayscale;
	position: relative;
	overflow: hidden;
}
.hvr-underline-from-center:before,
header .globalNav li a:before {
	content: "";
	position: absolute;
	z-index: -1;
	left: 50%;
	right: 50%;
	bottom: 0;
	background: #D58100;
	height: 4px;/* ラインの太さ */
	-webkit-transition-property: left, right;
	transition-property: left, right;
	-webkit-transition-duration: 0.3s;
	transition-duration: 0.3s;
	-webkit-transition-timing-function: ease-out;
	transition-timing-function: ease-out;
}
.hvr-underline-from-center:hover:before,
.hvr-underline-from-center:focus:before,
.hvr-underline-from-center:active:before,
header .globalNav li a:hover:before,
header .globalNav li a:focus:before,
header .globalNav li a:active:before,
header .globalNav .here a:before {
	left: 0;
	right: 0;
}


/* =========================================================
タブメニュー
========================================================= */

/* ナビの分割数
--------------------------------------------------------- */

/* ----- 二分割 ----- */
.nav-2 li {
	width: 50%;
}
.sub_nav .nav-2 li a {
	margin: 0 40px;
}

/* ----- 五分割 ----- */
.nav-5 li {
	width: 20%;
}

/* ----- 六分割 ----- */
.nav-6 li {
	width: 16.66666666666667%;
}

/* ----- 七分割 ----- */
.nav-7 li {
	width: 14.28571428571429%;
}


/* サブナビゲーション（サブナビ）
--------------------------------------------------------- */
.sub_nav {
	width: 100%;
	border-bottom: 2px solid #e7e7e7;
	margin: 16px 0 0 0;
}
.sub_nav ul {
	display: block;
	max-width: 1080px;
	width: 100%;
	margin: 0 auto;
	letter-spacing:-0.4em;/* inline-block Hack */
}
.sub_nav li {
	display: inline-block;
	letter-spacing: normal;/* inline-block Hack */
	*display: inline;/* inline-block Hack forIE */
	*zoom: 1;/* inline-block Hack forIE */
	vertical-align: middle;
}
.sub_nav li a {
	display: block;
	margin: 0 16px;
	padding: 24px 16px;
	/*background: #f5f5f5;/* 検証用 */
	color: #666;
	font-weight: 500;
	text-decoration: none;
}
.sub_nav .here a {
	color: #000;
}
/* ----- hoverで線を動かす----- */
/* Underline From Center /* Underline From Center */
.sub_nav a {
	vertical-align: middle;
	-webkit-transform: translateZ(0);
	transform: translateZ(0);
	box-shadow: 0 0 1px rgba(0, 0, 0, 0);
	-webkit-backface-visibility: hidden;
	backface-visibility: hidden;
	-moz-osx-font-smoothing: grayscale;
	position: relative;
	overflow: hidden;
}
.sub_nav a:before {
	content: "";
	position: absolute;
	z-index: -1;
	left: 50%;
	right: 50%;
	bottom: 0;
	background: #D58100;
	height: 4px;/* ラインの太さ */
	-webkit-transition-property: left, right;
	transition-property: left, right;
	-webkit-transition-duration: 0.3s;
	transition-duration: 0.3s;
	-webkit-transition-timing-function: ease-out;
	transition-timing-function: ease-out;
}
.sub_nav a:hover:before,
.sub_nav a:focus:before,
.sub_nav a:active:before,
.sub_nav .here a:before {
	left: 0;
	right: 0;
}

/* ----- スマホのフッターのサブナビ ----- */
footer .sub_nav {
	display: none;
}
/*tablet*/
@media screen and (min-width: 701px) and (max-width: 1020px) {
.sub_nav ul {
	max-width: 100%;
}
.sub_nav li a {
	margin: 0 2%;
	padding: 16px 2%;
	font-size: 90%;
}

/* ----- スマホのフッターのサブナビ ----- */
footer .sub_nav {
	display: none;
}
}
/*sp*/
@media screen and (max-width: 700px) {
.sub_nav ul {
	max-width: 100%;
}
.sub_nav li a {
	margin: 0;
	padding: 16px 2%;
	font-size: 1.2em;
}
.sub_nav.nav-5 li {
	width: 50%;
}
.sub_nav li {
	display: none;
}
.sub_nav li.here {
	display: block;
	width: 100%;
}

/* ----- スマホのフッターのサブナビ ----- */
footer .sub_nav {
	display: block;
	background: #f5f5f5;
	max-width: 100%;
	margin: 0;
	padding: 4px;
}
footer .sub_nav .h {
	margin: 24px auto;
}
footer .sub_nav ul {
	max-width: 100%;
}
footer .sub_nav li a {
	margin: 4px;
	padding: 24px 2%;
	background: #fff;
	font-size: 1em;
}
footer .sub_nav.nav-5 li {
	width: 50%;
}
footer .sub_nav li {
	display: inline-block;
}
footer .sub_nav li.here {
	display: none;
}
}

/* タブナビゲーション（タブメニュー）
--------------------------------------------------------- */
.tab_nav {
	width: 100%;
	border-bottom: 1px solid #ccc;
	margin: 30px 0 0 0;/* margin-top = 24px + ラインの太さ */
}
.tab_nav ul {
	display: table;
	width: 1080px;
	margin: 0 auto;
}
.tab_nav li {
	display: table-cell;
	vertical-align: middle;
}
.tab_nav li a {
	display: block;
	margin: 0;
	padding: 16px;
	/*background: #f5f5f5;/* 検証用 */
	border: 1px solid #ccc;
	border-left: 0;
	color: #333;
	font-weight: 500;
	text-decoration: none;
	position: relative;
	top: 1.1px;
	background: #fff;
	opacity: 0.7;
}
.tab_nav li:first-child a {
	border-left: 1px solid #ccc;
}
.tab_nav .here a {
	color: #000;
	border-bottom: 1px solid #fff;
}
.tab_nav a:hover,
.tab_nav .here a {
	opacity: 1;
}
/* ----- hoverで線を動かす----- */
/* Underline From Center /* Underline From Center */
.tab_nav a {
	vertical-align: middle;
	-webkit-transform: translateZ(0);
	transform: translateZ(0);
	box-shadow: 0 0 1px rgba(0, 0, 0, 0);
	-webkit-backface-visibility: hidden;
	backface-visibility: hidden;
	-moz-osx-font-smoothing: grayscale;
	position: relative;
	/*overflow: hidden;*/
}
.tab_nav a:before {
	content: "";
	position: absolute;
	z-index: -1;
	left: 50.1%;
	right: 50.1%;
	top: -6px;
	background: #D58100;
	height: 6px;/* ラインの太さ */
	-webkit-transition-property: left, right;
	transition-property: left, right;
	-webkit-transition-duration: 0.3s;
	transition-duration: 0.3s;
	-webkit-transition-timing-function: ease-out;
	transition-timing-function: ease-out;
}
/* タブのボーダーに合わせてラインの位置を微調整 */
.tab_nav a:hover:before,
.tab_nav a:focus:before,
.tab_nav a:active:before,
.tab_nav .here a:before {
	left: -0.5%;
	right: -0.7%;
}
.tab_nav li:first-child a:hover:before,
.tab_nav li:first-child a:focus:before,
.tab_nav li:first-child a:active:before,
.tab_nav li:first-child.here a:before {
	left: -1px;
	right: -1px;
}

/* ----- スマホのフッターのタブナビ ----- */
footer .tab_nav {
	display: none;
}
/*tablet*/
@media screen and (min-width: 701px) and (max-width: 1020px) {
.tab_nav ul {
	max-width: 100%;
}
.tab_nav li a {
	margin: 0;
	padding: 16px 2%;
	font-size: 90%;
}

/* ----- スマホのフッターのタブナビ ----- */
footer .tab_nav {
	display: none;
}
}
/*sp*/
@media screen and (max-width: 700px) {
.tab_nav ul {
	max-width: 100%;
}
.tab_nav li a {
	margin: 0;
	padding: 16px 2%;
	font-size: 1.2em;
}
.tab_nav.nav-5 li {
	width: 50%;
}
.tab_nav li {
	display: none;
}
.tab_nav li.here {
	display: block;
	width: 100%;
}
/* ボーダーの位置 */
.tab_nav a:before {
	top: auto;
	bottom: -6px;
}
/* ----- スマホのフッターのタブナビ ----- */
footer .tab_nav {
	display: block;
	background: #f5f5f5;
	max-width: 100%;
	margin: 0;
	padding: 4px;
}
footer .tab_nav .h {
	margin: 24px auto;
}
footer .tab_nav ul {
	max-width: 100%;
}
footer .tab_nav li a {
	margin: 4px;
	padding: 24px 2%;
	background: #fff;
	font-size: 1em;
}
footer .tab_nav.nav-5 li {
	width: 50%;
}
footer .tab_nav li {
	display: inline-block;
}
footer .tab_nav li.here {
	display: none;
}
}


/*sp*/
@media screen and (max-width: 700px) {
.faq_nav.forSP {
	width: 100%;
	display: block;
	letter-spacing:-0.4em;/* inline-block Hack */
}
.faq_nav.forSP li {
	width: 50%;
	display: inline-block;
	letter-spacing: normal;/* inline-block Hack */
	*display: inline;/* inline-block Hack forIE */
	*zoom: 1;/* inline-block Hack forIE */
}
.faq_nav.forSP li a {
	font-size: 0.9em;
	border-collapse: collapse;
}
/* ボーダーの位置 */
.faq_nav.forSP a:before {
	top: -6px;
	bottom: auto;
}

.tab_nav.faq_nav.forSP li a {
	border: 1px solid #ccc;
	border-bottom: 0;
	border-left: 0;
}
}

/* ----- navごとに色を変える----- */
/* ラインの色 */
.nav-ec a:before,
.nav-eltexdc a:before {
	background: #D58100;
}
.nav-marketing a:before,
.nav-eltexcx a:before {
	background: #005EAE;
}
.nav-design a:before {
	background: #00A1D3;
}
.nav-infra a:before {
	background: #009A59;
}
.nav-corporate a:before {
	background: #283F68;
}
.nav-torihiki a:before {
	background: #999;
}
/* テキストの色 */
.tab_nav a {
	color: #000;
}
.tab_nav a:hover {
	color: #000;
}
/*
.tab_nav .nav-ec a {
	color: #D58100;
}
.tab_nav .nav-marketing a {
	color: #005EAE;
}
.tab_nav .nav-design a {
	color: #005EAE;
}
.tab_nav .nav-infra a {
	color: #009A59;
}
.tab_nav .nav-eltex a {
	color: #283F68;
}
.tab_nav .nav-torihiki a {
	color: #283F68;
}*/






/* =========================================================
アイコン
========================================================= */



/* アイコンの種類
--------------------------------------------------------- */
.icon-ec i:before {
	content: "\f07a"; /* fa-shopping-cart */
	position: relative;
	top: -1px;
}
.icon-marketing i:before {
	content: "\f201"; /* fa-line-chart */
	font-size: 0.8em;
	font-weight: bold;
	position: relative;
	top: -1px;
}
.icon-design i:before {
	content: "\f1fc"; /* fa-paint-brush */
	font-size: 0.8em;
	position: relative;
	top: -1px;
}
.icon-infra i:before {
	content: "\f0c2"; /* fa-cloud */
	position: relative;
	top: -1px;
}
.icon-corporate i:before {
	content: "\f1ad"; /* fa-building */	
	position: relative;
	top: -1px;
	left: 1px;
}
.icon-torihiki i:before {
	content: "\f118"; /* fa-smile-o */
	position: relative;
	top: -1px;
}


/* 円形・塗り
--------------------------------------------------------- */

/* ----- アイコンの背景 ----- */
.icon.icon-circle {
	font-size: 24px;
	display: inline-block;
	margin: 0 6px 6px;
	background: #D58100;
	color: #fff;
	width: 40px;
	height: 40px;
	border-radius: 50%;
	vertical-align: middle;
	font-weight: normal;
	text-align: center;
}

/* ----- アイコンの背景の色 ----- */
.icon-ec.icon-circle {
	background: #D58100;
}
.icon-marketing.icon-circle {
	background: #005EAE;
}
.icon-design.icon-circle {
	background: #00A1D3;
}
.icon-infra.icon-circle {
	background: #009A59;
}
.icon-corporate.icon-circle {
	background: #283F68;
}
.icon-torihiki.icon-circle {
	background: #999;
}





/* 円形・アウトライン
--------------------------------------------------------- */

/* ----- アイコンの背景 ----- */
.icon.icon-circle-o {
	font-size: 24px;
	display: inline-block;
	margin: 0 6px 6px;
	background: #fff;
	border: 2px solid #D58100;
	color: #fff;
	width: 40px;
	height: 40px;
	border-radius: 50%;
	vertical-align: middle;
	font-weight: normal;
	text-align: center;
}

/* ----- アイコンの背景の色 ----- */
.icon-ec.icon-circle-o {
	background: #fff;
	border-color: #D58100;
}
.icon-marketing.icon-circle-o {
	background: #fff;
	border-color: #005EAE;
}
.icon-design.icon-circle-o {
	background: #fff;
	border-color: #00A1D3;
}
.icon-infra.icon-circle-o {
	background: #fff;
	border-color: #009A59;
}
.icon-corporate.icon-circle-o {
	background: #fff;
	border-color: #283F68;
}
.icon-torihiki.icon-circle-o {
	background: #fff;
	border-color: #999;
}

/* ----- アイコンの色 ----- */
.icon-ec.icon-circle-o i:before {
	color: #D58100;
}
.icon-marketing.icon-circle-o i:before {
	color: #005EAE;
}
.icon-design.icon-circle-o i:before {
	color: #00A1D3;
}
.icon-infra.icon-circle-o i:before {
	color: #009A59;
}
.icon-corporate.icon-circle-o i:before {
	color: #283F68;
}
.icon-torihiki.icon-circle-o i:before {
	color: #999;
}


/* 四角形・塗り
--------------------------------------------------------- */

/* ----- アイコンの背景 ----- */
.icon.icon-square {
	font-size: 24px;
	display: inline-block;
	margin: 0 6px 6px;
	background: #D58100;
	color: #fff;
	width: 40px;
	height: 40px;
	vertical-align: middle;
	font-weight: normal;
	text-align: center;
}
/* 角丸 */
.icon.icon-square.br {
	border-radius: 4px;
}
/* ----- アイコンの背景の色 ----- */
.icon-ec.icon-square {
	background: #D58100;
}
.icon-marketing.icon-square {
	background: #005EAE;
}
.icon-design.icon-square {
	background: #00A1D3;
}
.icon-infra.icon-square {
	background: #009A59;
}
.icon-corporate.icon-square {
	background: #283F68;
}
.icon-torihiki.icon-square {
	background: #999;
}

/* 四角形・アウトライン
--------------------------------------------------------- */

/* ----- アイコンの背景 ----- */
.icon.icon-square-o {
	font-size: 24px;
	display: inline-block;
	margin: 0 6px 6px;
	background: #fff;
	border: 2px solid #D58100;
	color: #fff;
	width: 40px;
	height: 40px;
	vertical-align: middle;
	font-weight: normal;
	text-align: center;
}
/* 角丸 */
.icon.icon-square-o.br {
	border-radius: 4px;
}
/* ----- アイコンの背景の色 ----- */
.icon-ec.icon-square-o {
	background: #fff;
	border-color: #D58100;
}
.icon-marketing.icon-square-o {
	background: #fff;
	border-color: #005EAE;
}
.icon-design.icon-square-o {
	background: #fff;
	border-color: #00A1D3;
}
.icon-infra.icon-square-o {
	background: #fff;
	border-color: #009A59;
}
.icon-corporate.icon-square-o {
	background: #fff;
	border-color: #283F68;
}
.icon-torihiki.icon-square-o {
	background: #fff;
	border-color: #999;
}

/* ----- アイコンの色 ----- */
.icon-ec.icon-square-o i:before {
	color: #D58100;
}
.icon-marketing.icon-square-o i:before {
	color: #005EAE;
}
.icon-design.icon-square-o i:before {
	color: #00A1D3;
}
.icon-infra.icon-square-o i:before {
	color: #009A59;
}
.icon-corporate.icon-square-o i:before {
	color: #283F68;
}
.icon-torihiki.icon-square-o i:before {
	color: #999;
}



/* ----- 大きさ ----- */
.icon.icon-80 {
	font-size: 40px;
	width: 120px;
	height: 120px;
	vertical-align: middle;
	font-weight: normal;
	text-align: center;
}



/* =========================================================
 共通アイコン
 （アイコン付きテキスト）
========================================================= */
.ph {
	text-indent: -18px !important;
	padding-left: 2.0em !important;
	position: relative;
}
.ph:before {
	font-family: "FontAwesome";
	font-size: 1.2em;
	padding: 0;
	font-weight: normal;
	color: #baa99f;
	position: relative;
	vertical-align: middle;

    display: inline-block;
    font-feature-settings: normal;
    font-kerning: auto;
    font-language-override: normal;
    font-size-adjust: none;
    font-stretch: normal;
    font-style: normal;
    font-synthesis: weight style;
    font-variant: normal;
    font-weight: normal;
    line-height: 1;
    text-rendering: auto;
    transform: translate(0px, 0px);
	
	left: 5px;
	top: -0.1em;
	width: 18px;
	text-align: center;
}

/* ----- common ----- */
.ph.info-circle:before {
	content: "\f05a"; /* 「インフォメーション」アイコン */
}
.ph.lock:before {
	content: "\f023"; /* 「錠前（鍵穴なし）」アイコン */
}
.ph.user:before {
	content: "\f007"; /* 「ユーザー」アイコン */
}
.ph.chevron-circle-right:before {
	content: "\f138"; /* 「右矢印（円形）」アイコン */
}
.ph.question-circle:before {
	content: "\f059"; /* 「？（円形）」アイコン */
}
.ph.shopping-cart:before {
	content: "\f07a"; /* 「カート」アイコン */
}
.ph.smile-o:before {
	content: "\f118"; /* 「スマイル」アイコン */
}
.ph.icon-locked:before {
	font-family: "icomoon";
	content: "\e801"; /* 「錠前」アイコン */
}
.ph.exclamation-triangle:before {
	content: "\f071"; /* 「ご注意（三角形）」アイコン */
}
.ph.exclamation-circle:before {
	content: "\f06a"; /* 「ご注意（円形）」アイコン */
}
.ph.icon-warning:before {
	font-family: "icomoon";
	content: "\e903"; /* 「ご注意（三角形）」アイコン2 */
	font-size: 110%;
}
.ph.gift:before {
	content: "\f06b"; /* 「プレゼントの箱」アイコン */
}
.ph.check-circle:before {
	content: "\f058"; /* 「チェック（円形）」アイコン */
}
.ph.check-square-o:before {
	content: "\f046"; /* 「チェック（四角形）」アイコン */
}
.ph.envelope:before {
	content: "\f0e0"; /* 「メール」アイコン */
	font-size: 110%;
}
.ph.circle:before {
	content: "\f111"; /* 「黒丸」アイコン */
	font-size: 100%;
}


.ph.chevron-circle-right:before {
	content: "\f138"; /* 「矢印・右（円形）」アイコン */
}

/* ----- errorMessage ----- */
.color-red.ph:before,
.errorMessage.ph:before {
	color: #e30011;
}
.errorMessage.ph:before {
	font-family: "icomoon";
	content: "\e903"; /* 「ご注意（三角形）」アイコン2 */
	font-size: 110%;
}
/* ----- alert_msg ----- */
.ph.alert_msg-error:before {
	font-family: "icomoon";
	content: "\e903"; /* 「ご注意（三角形）」アイコン2 */
	font-size: 110%;
	color: #e30011;
}
.ph.alert_msg-attention:before {
	content: "\f06a"; /* 「ご注意（円形）」アイコン */
}
.ph.alert_msg-hint:before {
	content: "\f058"; /* 「チェック（円形）」アイコン */
	color: #78a000;
}
.ph.alert_msg-info:before {
	content: "\f05a"; /* 「インフォメーション」アイコン */
	color: #4097d4;
}
.ph.alert_msg-help:before {
	content: "\f059"; /* 「？（円形）」アイコン */
	color: #e97300;
}
.ph.alert_msg-promotion:before {
	content: "\f06b"; /* 「プレゼントの箱」アイコン */
	color: #eda0b1;
	font-size: 155%;
}

.ph_after_group {
	margin-left: 2em;
	margin-top: 0.5em;
}




/* =========================================================
境界線・水平線
========================================================= */

hr {
    border: 0;
    height: 0;
    border-top: 1px solid #666;
	margin: 24px 0;
}
.hr-1 {
	border-top: 1px solid #f0f0f0;
}
.hr-2 {
	border-top: 2px solid #f0f0f0;
}
.hr-4 {
	border-top: 4px solid #f0f0f0;
}
.bg-pgray .hr,
.bg-pgray .hr-4,
.bg-pgray .hr-1,
.bg-pgray .hr-2 {
	border-color: #e0e0e0 !important;
}




.arrow_wide {
	width: 160px;
	text-align: center;
	margin: 0 auto;
}
.arrow_wide.section_hr {
	position: relative;
	top: -48px;
}
/*tablet and sp*/
@media screen and (max-width: 1020px) {
.arrow_wide.section_hr {
	top: -16px;
}
}

/* =========================================================
テキスト強調
========================================================= */

.em {
	font-weight: bold;	
}
.marker {
	background: linear-gradient(transparent 60%, #F1EC35 60%);
}



/* =========================================================
箇条書きリスト
========================================================= */

/* 算用数字リスト
--------------------------------------------------------- */
ol.decimal li {
	list-style-position: outside;
	margin-left: 1.5em;
	margin-top: 0.5em;
	margin-bottom: 0.5em;
}
ol.decimal > li {
	list-style-type: decimal !important;
}


/* 箇条書きリスト（ノーマル）
--------------------------------------------------------- */
/*
ul.disc li {
	list-style-position: outside;
	margin-left: 1.5em;
	margin-top: 0.5em;
	margin-bottom: 0.5em;
}
ul.disc > li {
	list-style-type: disc !important;
}
*/

ul.disc li {
	text-indent: -1em !important;
	padding-left: 1em !important;
	position: relative;
	
	margin-bottom: 0.5em;
}
ul.disc li:before {
	/*font-family: "FontAwesome";*/
	font-size: 1em;
	padding: 0;
	font-weight: bold;
	/*color: #baa99f;*/
	position: relative;
	vertical-align: middle;

    display: inline-block;
    font-feature-settings: normal;
    font-kerning: auto;
    font-language-override: normal;
    font-size-adjust: none;
    font-stretch: normal;
    font-style: normal;
    font-synthesis: weight style;
    font-variant: normal;
    font-weight: normal;
    line-height: 1;
    text-rendering: auto;
    transform: translate(0px, 0px);
	
	left: 5px;
	top: -0.1em;
	width: 1em;
	text-align: center;
	
	content: "・";
}

/* 丸括弧付き数字のリスト
--------------------------------------------------------- */
ol.paren {
	counter-reset: item;
	list-style: none;
}
ol.paren li:before{
	content: "(" counters(item, "-") ")";
	counter-increment: item;
	margin-right: 0;
	position: relative;
	left: -0.5em;
}
ol.paren li{
	margin-left: 2em;
	text-indent: -1.5em;
	list-style-type: none;
}


/* ※印付きの文章
--------------------------------------------------------- */
.kome,
.indent_1 {
	margin-left: 1em !important;
	text-indent: -1em !important;
}




/* =========================================================
swiperスライダー
========================================================= */

/* ----- client_logo_slider　導入実績ロゴスライダー ----- */
.swiper-container.client_logo_slider {
	width: 100%;
	margin: 32px auto;
	padding: 0 48px;
	height: 120px;
}
.client_logo_slider .swiper-slide {
	text-align: center;
	font-size: 18px;
	background: #fff;
	width: 12%;
	margin: 0 48px;
	/* Center slide text vertically */
	display: -webkit-box;
	display: -ms-flexbox;
	display: -webkit-flex;
	display: flex;
	-webkit-box-pack: center;
	-ms-flex-pack: center;
	-webkit-justify-content: center;
	justify-content: center;
	-webkit-box-align: center;
	-ms-flex-align: center;
	-webkit-align-items: center;
	align-items: center;
}
/*tablet*/
@media screen and (min-width: 701px) and (max-width: 1020px) {
.swiper-container.client_logo_slider {
	margin: 32px auto;
	height: 80px;
}
.client_logo_slider .swiper-slide {
	width: 20%;
	margin: 0 4%;
}
}
/*sp*/
@media screen and (max-width: 700px) {
.swiper-container.client_logo_slider {
	margin: 16px auto;
	height: 80px;
}
.client_logo_slider .swiper-slide {
	width: 32%;
	margin: 0 8%;
}
}
/* ----- product_logo_slider　製品ロゴスライダー ----- */
.swiper-container.product_logo_slider {
	width: 100%;
	height: 88px;
	margin: 32px auto 0;
	padding: 0 48px;
}
.product_logo_slider .swiper-slide {
	text-align: center;
	font-size: 18px;
	background: #fff;
	width: 320px;
	height: 82px;
	margin: 0 8px;
	padding: 0;
	/* Center slide text vertically */
	display: -webkit-box;
	display: -ms-flexbox;
	display: -webkit-flex;
	display: flex;
	-webkit-box-pack: center;
	-ms-flex-pack: center;
	-webkit-justify-content: center;
	justify-content: center;
	-webkit-box-align: center;
	-ms-flex-align: center;
	-webkit-align-items: center;
	align-items: center;
}
