/* 2022.11.1　ヘッダーに電話番号を追加、配置の変更（西村） */

@charset "UTF-8";

/* font awesome*/
@import url("//maxcdn.bootstrapcdn.com/font-awesome/4.7.0/css/font-awesome.min.css");

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

	Common
	Setup
	Layout
	Header
	Footer

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

/* ***********************************************************************
	Common
*********************************************************************** */

/******************   text   ******************/

.left   { text-align:left;   }
.center { text-align:center; }
.right  { text-align:right;  }
.ls1    { letter-spacing:1px;}

.bold{font-weight:bold !important;}
 
.font10{font-size:10px !important;}
.font11{font-size:11px !important;}
.font12{font-size:12px !important;}
.font13{font-size:13px !important;}
.font14{font-size:14px !important;}
.font15{font-size:15px !important;}
.font16{font-size:16px !important;}
.font17{font-size:17px !important;}
.font18{font-size:18px !important;}
.font19{font-size:19px !important;}
.font20{font-size:20px !important;}
.font21{font-size:21px !important;}
.font22{font-size:22px !important;}
.font23{font-size:23px !important;}
.font24{font-size:24px !important;}

/* テキストの回り込みをさせない */
.overflow {
	overflow: auto;
}

/*****************   margin   *****************/

.m0   { margin:0px; }
.m2   { margin:2px;  }
.m3   { margin:3px;  }
.m4   { margin:4px;  }
.m5   { margin:5px;  }
.m10  { margin:10px; }
.m15  { margin:15px; }
.m20  { margin:20px; }

.mt2  { margin-top:2px;  }
.mt3  { margin-top:3px;  }
.mt4  { margin-top:4px;  }
.mt5  { margin-top:5px;  }
.mt10 { margin-top:10px; }
.mt15 { margin-top:15px; }
.mt20 { margin-top:20px; }
.mt25 { margin-top:25px; }
.mt30 { margin-top:30px; }
.mt1em { margin-top:1em; }

.mb2  { margin-bottom:2px;  }
.mb3  { margin-bottom:3px;  }
.mb4  { margin-bottom:4px;  }
.mb5  { margin-bottom:5px;  }
.mb10 { margin-bottom:10px; }
.mb15 { margin-bottom:15px; }
.mb20 { margin-bottom:20px; }
.mb25 { margin-bottom:25px; }
.mb30 { margin-bottom:30px; }
.mb35 { margin-bottom:35px; }
.mb40 { margin-bottom:40px; }
.mb1em { margin-bottom:1em; }

.mr2  { margin-right:2px;  }
.mr3  { margin-right:3px;  }
.mr4  { margin-right:4px;  }
.mr5  { margin-right:5px;  }
.mr10 { margin-right:10px; }
.mr15 { margin-right:15px; }
.mr20 { margin-right:20px; }
.mr25 { margin-right:25px; }
.mr30 { margin-right:30px; }

.ml2  { margin-left:2px;  }
.ml3  { margin-left:3px;  }
.ml4  { margin-left:4px;  }
.ml5  { margin-left:5px;  }
.ml10 { margin-left:10px; }
.ml15 { margin-left:15px; }
.ml20 { margin-left:20px; }
.ml25 { margin-left:25px; }

/*****************   padding   *****************/

.p0   { padding:0px; }
.p2   { padding:2px;  }
.p3   { padding:3px;  }
.p4   { padding:4px;  }
.p5   { padding:5px;  }
.p10  { padding:10px; }
.p15  { padding:15px; }
.p20  { padding:20px; }

.pt2  { padding-top:2px;  }
.pt3  { padding-top:3px;  }
.pt4  { padding-top:4px;  }
.pt5  { padding-top:5px;  }
.pt10 { padding-top:10px; }
.pt15 { padding-top:15px; }
.pt20 { padding-top:20px; }
.pt25 { padding-top:25px; }
.pt30 { padding-top:30px; }

/*****************   space   *****************/

.space2   { height:2px; }
.space3   { height:3px; }
.space4   { height:4px; }
.space5   { height:5px; }
.space10  { height:10px; }
.space15  { height:15px; }
.space20  { height:20px; }
.space25  { height:25px; }
.space30  { height:30px; }

/******************   float   ******************/

.floatl { float:left;  }
.floatr { float:right; }
.clear  { clear:both;  }

/******************   border   ******************/

.imgb { border: 1px solid #ccc; }


/******************   clearfix   ******************/

#wrapper:after,
.clearfix:after {
    display: block; 
    height: 0; 
    clear: both; 
    visibility: hidden;
}

#wrapper,
.clearfix {
    min-height: 1px;
}

* html .clearfix {
  height: 1px;
  /*¥*//*/
  height: auto;
  overflow: hidden;
  /**/
}



/* ***********************************************************************
	Setup
*********************************************************************** */

a, a:link, a:visited {
	color: #0071BC;
	text-decoration: underline;
}
a:hover, a:active {
	color: #29ABE2;
	text-decoration: none;
}
body {
	background: #fff;
	font-family: verdana,"ヒラギノ角ゴ Pro W3","Hiragino Kaku Gothic Pro","メイリオ","Meiryo","ＭＳ Ｐゴシック",Osaka,arial,sans-serif;
	color: #333;
	font-size: 13px;
	font-style: normal;
	font-weight: normal;
	line-height: 1.6;
}
*:first-child+html body { /* for WinIE7 */
	font-family: "メイリオ","Meiryo",sans-serif;
}


/* ***********************************************************************
	Layout
*********************************************************************** */

#wrapper {
	width: 100%;
	margin: 0;
}
#contents {
	width: 100%;
	padding: 100px 0 0 0; /* ヘッダーの高さ */
	background: #FFF;
	text-align: left;
}
#contents_inner {
	width: 1050px;
	margin: 0 auto;
	text-align: left;
}
#contents_main {
	float: left;
	width: 730px;
	margin: 15px 0  30px 0;
	padding: 10px 20px 20px 20px;
	border: 1px solid #e1e1e1;
}
#contents_sub {
	float: right;
	position: relative;
	width: 250px;
	margin: 15px 0 0 0;
	padding: 0 0 40px 0;
}

/* サイドメニュー
-------------------------------------------------- */
#contents_sub ul {
	border-left: 1px solid #e1e1e1;
	border-bottom: 1px solid #e1e1e1;
	border-right: 1px solid #e1e1e1;
}
/* 中項目 */
#contents_sub li {
	border-top: 1px solid #e1e1e1;
	font-size: 12px;
}
#contents_sub li a {
	display: block;
	padding: 10px 5px 10px 25px;
	color: #333;
	line-height: 1.4;
	text-decoration: none;
	background: url("../img/common/arrow.gif") no-repeat 10px 50% ;
}
#contents_sub li a,
.class-service #contents_sub li a { background-color: #cce7f3; }
.class-works #contents_sub li a { background-color: #e6f3cc; }
.class-column #contents_sub li a { background-color: #feefcc; }
.class-download #contents_sub li a { background-color: #ffe0cc; }
#download #contents_sub li a { background-color: #ffe0cc; }

/* 小項目 */
#contents_sub li.sub {
	border-top: 1px dotted #CCC;
	font-size: 11px;
}
#contents_sub li.sub a {
	padding: 10px 0 10px 19px;
	background: url("../img/common/arrow-min.gif") no-repeat 11px 50% ;
}
.class-service #contents_sub li.sub a,
.class-works #contents_sub li.sub a,
.class-column #contents_sub li.sub a,
.class-download #contents_sub li.sub a,
#download #contents_sub li.sub a,
.class-company #contents_sub li.sub a,
.class-recruit #contents_sub li.sub a { background-color: #fff; }
/* hover設定 */
#contents_sub li a:hover,
#contents_sub li.sub a:hover {
	text-decoration: underline;
}

/* サイドメニュー
-------------------------------------------------- */
.contents_sub_side img { width: 250px; }
.contents_sub_side p { margin: 0 0 10px 0; }
.contents_sub_side p:first-of-type { margin: 20px 0 10px 0; }

body.js_fixed .js_sidebanner {
  position: fixed;
  top: 100px;
  left: auto;
  z-index: 1;
}

/* ***********************************************************************
	Header
*********************************************************************** */
#header {
	position: fixed;
	width: 100%;
	height: 100px;
	background: #000;
	z-index: 90000;
}
.header_inner {
	width: 1050px;
	margin: 0 auto;
	position: relative;
}
.header_logo {
	float: left;
	width: 217px;
}
.header_logo .logo {
	margin: 15px 0 0 0;
}
.header_nav {
	width: auto;
}

/* header_nav_info
-------------------------------------------------- */
.m_temp_header_nav_info {
	display: flex;
	justify-content: flex-end;
	align-items: flex-end;
}

.m_temp_header_nav_info li {
  margin-left: 25px;
}

.m_temp_header_nav_info li a {
  display: block;
}

.m_temp_header_nav_info li a:hover {
  opacity: 0.8;
}

/* global_nav
-------------------------------------------------- */
.global_nav {
	height: 30px;
	margin: 0;
}
/* ナビ全体の位置 */
.global_nav ul {
	font-size: 0;
	line-height: 0;
	vertical-align: bottom;
	margin-top: 12px;
  display: flex;
	justify-content: space-between;
}
.global_nav a {
	/*float: left;*/
	height: 30px;
	text-indent: -9999px;
	overflow: hidden;
	cursor:pointer;
	margin: 0 20px 0 0;
	display: block;
}

.global_nav .nav_service { width: 91px; background: url("../img/common/nav_service.gif") no-repeat; }
.global_nav .nav_works { width: 91px; background: url("../img/common/nav_works.gif") no-repeat; }
.global_nav .nav_column { width: 136px; background: url("../img/common/nav_column.gif") no-repeat; }
.global_nav .nav_download { width: 120px; background: url("../img/common/nav_download.gif") no-repeat; }
.global_nav .nav_company { width: 91px; background: url("../img/common/nav_company.gif") no-repeat; }
.global_nav .nav_recruit { width: 91px; background: url("../img/common/nav_recruit.gif") no-repeat; }
.global_nav .nav_mailmag { width: 207px; background: url("../img/common/nav_mailmag_backnumber.gif") no-repeat; margin: 0; }

/* マウスオン */
.global_nav .nav_service:hover,
.global_nav .nav_works:hover,
.global_nav .nav_column:hover,
.global_nav .nav_download:hover,
.global_nav .nav_company:hover,
.global_nav .nav_recruit:hover,
.global_nav .nav_mailmag:hover { background-position: 0 -30px; }

/* 各ページ */
.class-service .global_nav a.nav_service,
.class-works .global_nav a.nav_works,
.class-column .global_nav a.nav_column,
.class-download .global_nav a.nav_download,
#download .global_nav a.nav_download,
.class-company .global_nav a.nav_company,
.class-recruit .global_nav a.nav_recruit,
.class-mail-magazine .global_nav a.nav_mailmag { background-position: 0 -30px; }

/* for SP */
#header .global_nav_sp {
	display: none;
}

/* ***********************************************************************
	Footer
*********************************************************************** */

/* footer
-------------------------------------------------- */
#footer {
	clear: both;
	width: 100%;
	background: #000;
	text-align: left;
}
#footer_inner {
	width: 1050px;
	margin: 0 auto;
  position: relative;
}
.footer_box {
	float: left;
	width: 194px;
	margin: 0 20px 0 0;
	padding: 30px 0;
}
.footer_box.last {
	margin: 0;
}

/* タイトル */
#footer h4 {
	width: 194px;
	padding: 10px 0 15px 0;
	border-top: 2px solid #fff;
	color: #fff;
	font-size: 14px;
}

/* リスト */
#footer_inner ul {
	background: url(../img/common/footer_line.gif) repeat-x bottom left;
}
#footer_inner li {
	padding: 3px 0;
	background: url(../img/common/footer_line.gif) repeat-x top left;
	font-size: 11px;
	line-height: 2;
}

/* リンク */
#footer a, #footer a:link, #footer a:visited { color: #FFF; text-decoration: none; }
#footer a:hover { text-decoration: underline; }

/* フッター下部
-------------------------------------------------- */
.footer_bottom {
	padding: 20px 0;
	background: #333;
	font-size: 11px;
	font-style: normal;
}
.footer_bottom_inner {
	width: 1050px;
	margin: 0 auto;
}
.footer_bottom_link a {
	color: #fff;
	text-decoration: none;
}
.footer_bottom_copyright {
	float: left ;
	width: 50%;
	color: #999;
	text-align: right;
}
.footer_pmark {
  position: absolute;
  bottom: 20px;
  right: 0;
}
.footer_pmark p {
  display: block;
  width: 75px;
  height: 75px;
  padding: 12px;
  background: #fff;
}
.footer_pmark a {
  display: block;
  width: 100%;
  height: auto;
}

.m_temp_footer_list {
  display: flex;
}

.m_temp_footer_list li:after {
  content: "|";
  margin: 0 12px;
  color: #fff;
}

.m_temp_footer_list li:last-child:after {
  content: none;
  margin: 0;
}

@media screen and (max-width: 767px) {
  .footer_pmark {
    position: relative;
    padding-top: 20px;
  }
  
  .footer_pmark p {
    margin: 0 auto;
  }
  
  .m_temp_footer_list {
    justify-content: center;
  }
}

@media screen and (max-width: 570px) {
  .m_temp_footer_list {
    flex-wrap: wrap;
    padding: 0 10px;
  }
  
  .m_temp_footer_list li {
    line-height: 1.7em;
  }
  
  .m_temp_footer_list li:after {
    margin: 0 8px;
  }
}