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

/* common */

body{
	font-size:100%;
	font-family: "ヒラギノ角ゴ Pro W3", "Hiragino Kaku Gothic Pro", "メイリオ", Meiryo, Osaka, "ＭＳ Ｐゴシック", "MS P Gothic", sans-serif;
	margin:0;
	padding:0;
	color : #444;
	background:#FFF;}
	
p{
	line-height:1.7;
	margin:0;}
	
ul{
	list-style:none; 
	margin:0; 
	padding:0;}
	
a:hover{
opacity: .8;
transition: 1.0s ;}
a {
	text-decoration: none;
	color: #ED0707;
	transition: 1.0s;
	word-break: break-all;}
	
img{ display:block; width:100%;}
	
.wrapper{
	width:100%;
	max-width:1920px;
	margin:0 auto;
	position:relative;}
	
h1,h2{
	color:#333333;
	font-size:190%;
	letter-spacing:2px;
	margin:0 auto;}

.headline{text-align:center;}
	
.headline h2{padding-bottom:5px;}

.headline span{
	color:#999999;
	font-size:85%;
	font-weight:bold;}

.case_bg_colored .headline span,
.case_bg_img .headline span{color:#FFF;}

h3{
	font-size:125%;
	display:flex;
	align-items:center;
	}
.page_title{
	background: url(../img/common/title_bg.jpg) #f8f8f8 no-repeat right bottom;
	background-size: contain;
	height:150px;
	text-align:center;
	display:flex;
	justify-content: center;
	align-items: center;
}
/*.page_title{
	background: -moz-linear-gradient(top left, rgba(245,194,57,0.75), rgba(255,255,255,0)),url(../img/common/contact_bg.png); 
	background: -webkit-linear-gradient(top left, rgba(245,194,57,0.75), rgba(255,255,255,0)),url(../img/common/contact_bg.png); 
	background: linear-gradient(to bottom right, rgba(245,194,57,0.75), rgba(255,255,255,0)),url(../img/common/contact_bg.png);
	background-size:cover;
	height:150px;
	text-align:center;
	display:flex;
	justify-content: center;
	align-items: center;
}*/
.sub_headline h1{

}
.sub_headline:after{
	display:block;
	content:"";
	background:url(../img/common/arrow_bottom.png) bottom center;
	background-size:contain;
	width:20px;
	height:10px;
	margin:10px auto 0;
}

.case_bg_white h3,
.case_bg_white h3.title_basic,
.case_bg_white h3.title_basic:before,
.case_bg_white h3 span.number
{ z-index:-999;}

h3.title_basic {
  color: #333;
  line-height: 1.3;
  position: relative;
  font-weight: bold;
  padding: 0 0 5px;
  border-bottom: 3px solid #CCC;
  border-radius: 1.5px;
}

h3.title_basic:before {
  position: absolute;
  bottom: -3px;
  left: 0;
  width: 15%;
  height: 3px;
  content: '';
  background: #ED0707;
}

/*h3.sub_title_basic{
	color:#505050;
	color: #ED0707;
	background-color:rgba(237,7,7,0.04);
	padding:5px 20px;
	margin:30px 0 0;
}*/
	
h3 span.number{
	width:30%;
	max-width:100px;
	background-color: #F6F6F6;
	color:#666;
	text-align:center;
	font-size:12px;
	padding:5px 10px;
	margin:0 15px 0 0;
	letter-spacing:1px;
}
h3.industry_subtitle{
	color:#000;
	margin-bottom:10px;
}

h4{
	margin:0 0 20px;
	font-size:110%;
	color:#333;
	}


@media only screen and (max-width:767px) {
h1,h2{
	font-size:20px;
	line-height:1.3;}
h3{
	font-size:18px;
}
h3.title_basic{
	display: block;
}
h3 span.number{
	margin: 0 0 10px 0;
	display: block;
}
h3 span.enterprise{
	display: block;
}
.page_title{
	height:100px;
	padding:0 5%;
}
}
/* header
**************************/
header#header{
	padding:0px;
	margin:0;
	width:100%;
	max-width:1920px;
	position:fixed;
	z-index:999;
	box-sizing:border-box;}

/*上からフェードイン*/
.fade-in-top {
   opacity: 0;
   animation: fadein-top 1.5s .3s ease-out forwards;
}
@keyframes fadein-top {
   0% {
      opacity: 0;
      transform: translateY(-20px);
   }
   100% {
      opacity: 1;
      transform: translateY(0);
   }
}
header .headerInner{
	width:94%;
	margin:0 auto;
	padding:10px 3% 3px;
	overflow:hidden;
	position:fixed;
	background:rgba(255,255,255,0.9);
	max-height: 95px;
}

#nav-drawer{
	padding-top:100px;}
	
header .logo{
	float:left;
	width:20%;
	margin-right:20%;
}
header .logo .logo_icon{
	display: flex; /* 子要素をflexboxで揃える */
    align-items: center; /* 子要素をflexboxにより縦方向に揃える */
}
	
header .logo img{
	max-width:200px;
}

header .logo .logo_icon,
header .logo .logo_icon a,
header .logo .logo_icon a img{
border:none;
}

header .logo .logo_text{
	font-size:11px;
	color: #333;
	/*color:#707070;*/
	margin-top:5px;
	font-weight: 700;
}
	
header .contact_top{
	display:block;
	text-align:right;
	float:left;
	width:60%;
	display: flex;
	justify-content: flex-end;
}

.contact_top .layLeft{
	width:55%;
}
.contact_top .layRight{
	width:45%;
	max-width: 280px;
}
@media screen and (min-width:999px) {
.contact_top .layLeft{
	max-width:330px;
}
}
@media screen and (min-width:768px) {
header .logo{
	width:26%;
	margin-right:4%;
}
header .contact_top{
	width:70%;		
}
.contact_top .layLeft{
	max-width:280px;
}
}
@media screen and (max-width:799px){
.contact_top .layLeft{
	width: 55%;
	max-width: inherit;
}
.contact_top .layRight{
	width: 50%;
}
}
.contact_top .layLeft .tel_title{
	background-color:#FFF3D0;
	text-align:center;
	font-size:11px;
}

.contact_top .layLeft .top_tel li{
	line-height:1em;
}

.contact_top .layLeft .top_tel .b_hour{
	font-size:11px;
	text-align:center;
}

.contact_top .layRight .top_mail{
	margin:0 0 0 auto;
	width:90%;
}

.contact_top .layRight .top_mail a,
.contact_top .layRight .top_mail a img{
	width:100%;
	max-width: 340px;
}
	

header .logo a img:hover{
	opacity:.8;}

/*header .top_tel a{
	display: inline-block;
	background: url(../img/common/tel_.png) center / cover no-repeat;
}*/
header .top_mail a {
	display: inline-block;
	background: url(../img/common/contact_.png) center / contain no-repeat;
}
/*header .top_tel a img,*/
header .top_mail a img {
	vertical-align: middle;
	transition: opacity .7s;
}
/*header .top_tel a:hover img,*/
header .top_mail a:hover img {
	opacity: 0;
}

.top_tel a .headerTel:before {
	content: '';
	display: inline-block;
	background:url(../img/common/tel_icon.png) left top no-repeat;
	background-size: contain;
	width: 30px;
	height: 38px;
	margin-right: 5px;
}
.top_tel a .headerTel{
	color: #333;
	font-size: 28px;
	font-weight: bold;
	white-space: nowrap;
	display: flex;
	align-items: center;
}
.top_tel a .headerTel:hover{
	opacity: 0.6;
	/*color: #ffcc00;*/
	-webkit-transition: all 0.7s;
    -moz-transition: all 0.7s;
    -ms-transition: all 0.7s;
    -o-transition: all 0.7s;
    transition: all 0.7s;
}
@media only screen and (max-width:999px) {
.top_tel a .headerTel{
	font-size: 158%;
}
}

/* ナビゲーション
**************************/

nav .panel{
display:block !important;
}

#nav-content,
#nav-input,
a#menu{display:none;}

#mainNav{
clear:both;
z-index:0;
position:relative;
width:100%;
background-color: #FFF;
box-shadow: 0px 1px 0px rgba(204,204,204,0.3);
}

#mainNav .menu_line{
	width:100%;
	height:36px;
	border-bottom:4px solid #fff;
}

#mainNav .inner{
	width:90%;
	margin:0 auto;
	}

#mainNav ul{
display: flex;
justify-content: space-between;
margin:0;
padding:0;
position:relative;
}

#mainNav li{
	letter-spacing:0.5px;
	margin:0;
	width:20%;}

#mainNav li.current-menu-item a{
color:#500606;
font-weight:bold;
display: block;
font-weight: bold;
text-align: center;
padding:0;}

#mainNav li a strong{
	display:block;
	font-weight:bold;}
	
#mainNav li a:hover strong{
	color:#ED0707;}

#mainNav li a:after {
content: '';
width: 0;
transition: all 0.3s ease;
padding-bottom: 36px;
border-bottom: 4px solid #ED0707;
display: block;
}

#mainNav li a:hover:after{
width: 100%;
border-bottom: 4px solid #ED0707;
}

#mainNav li ul li a:after{
padding-bottom: 0;
border-bottom: none;}
#mainNav li ul li a:hover:after{
border-bottom: none;
}

#mainNav ul li.current-menu-item{
height: 40px;
position: relative; /*中央揃えしたい要素の親要素に指定*/
}

#mainNav li.current-menu-item strong{
  position: absolute;  /*要素を浮かす*/
  /*relativeを指定した親要素を支点とした位置をすべて0に指定↓*/
  top: 0;
  right: 0;
  bottom: 0;
  left: 0;
  margin: auto; /*上下左右中央に*/
  width: 100%; /*widthの指定は必須*/
  height: 40px; /*heightの指定は必須*/
}

#mainNav li.current-menu-item strong{
	font-size: 16px;
	color:#333;
	font-weight: bold;
	height: 40px;
	display: block;
	line-height: 1;
	padding: 0 10px;
	box-sizing: border-box;
	display: flex;
	flex-flow: column;
	justify-content: center;
	text-align:center;
}

/*#mainNav li.current-menu-item > a{
border-color:#555;
font-size: 16px;
font-weight: bold;
height: 40px;
display: block;
line-height: 1;
padding: 0 10px;
box-sizing: border-box;
display: flex;
flex-flow: column;
justify-content: center;
}

#mainNav li.current-menu-item > a:hover{
  opacity: 1;}
#mainNav li a:hover,#mainNav li.current-menu-item li a:hover{
	opacity:0.6;}*/

/* open */
@keyframes fadeIn {
    0% {opacity: 0}
    100% {opacity: 1}
}


#mainNav ul ul{
	width:150%;
	background-color:rgba(240,240,240,1);
	box-shadow:0px 0.8px 1px rgba(153,153,153,0.3);
}
	
#mainNav li ul{display:none;}

#mainNav li:hover ul{
	display:block;
	position:absolute;
	top:40px;
	left:0;
	animation: fadeIn 1s ease 0s 1 normal;
	border-top:3px solid rgba(153,153,153,0.2);
	z-index:999;
}

#mainNav ul.sub-menu li a{
	height:auto;
	padding:0;}

#mainNav li li{
	margin:0;
	float:none;
	border-bottom:0.8px solid #FFF;
	width:100%;
	border-left:none;
	border-right:none;
	}

#mainNav li li:last-child{
	border-bottom:none;
}

#mainNav li li a .menu-list:hover {
	color:rgba(237,7,7,1);}

#mainNav li li a:hover {
	background-color:#FFF;
}

#mainNav li li .menu-list {
	color:#333;
	display: block;
	text-align: left;
	font-size:90%;
	width:auto;
	height:auto;
	padding:6px 15px 6px 25px;
}

/*
#mainNav li li:before{
	  font-family: 'Font Awesome 5 Free';
	  font-weight: 700;
	  content: '\f0da';
	  font-size: 10px;
	  color: #500606;
	  position: absolute;
 	  width: 10px;
 	  height: 10px;
	  top: 0;
	  bottom: 0;
	  left: 15px;
	  margin: auto;
}*/

#mainNav ul ul ul{
	width:100%;
	background-color:rgba(240,240,240,1);
}

#mainNav li li li a:hover {
	background-color:#FFF;
	/*background:rgba(255,255,255,0.9);*/
}	
#mainNav li ul.sub-menu li ul.sub-menu-inner{
	display:none;}
	
#mainNav li ul.sub-menu li{
	position:relative;
	}
#mainNav li ul.sub-menu li:hover ul.sub-menu-inner{
	display:block;
	position:absolute;
	top:0;
	left:100%;
	animation: fadeIn 1s ease 0s 1 normal;
	z-index:999;
}

#mainNav li:hover ul.sub-menu li ul.sub-menu-inner {
	border-top:none;
}

/*
#mainNav li li li{
	float:left;
	width:50%;
}*/

#mainNav li li li a .menu-list-title {
	color:#333;
	display: block;
	text-align: left;
	font-size:85%;
	width:auto;
	height:auto;
	padding:6px 15px 6px 25px;
}

#mainNav li li li a .menu-list-title:hover{
	color:rgba(237,7,7,1);
}

/* パンくず 
**************************/
.breadcrumbs{
	background-color:#FFF;}

.breadcrumbs ul{
	width: 90%;
	margin:0 auto;}

.breadcrumbs ul li{
	display:inline-block;}

.breadcrumbs ul li a{
	font-size:11px;
	color:#666;
}

.breadcrumbs ul li a.current{
	color:#ED0707;
}

.breadcrumbs ul li a:after{
	content:">";
	display: inline-block;
	margin:0 10px;
}

.breadcrumbs ul li a.current:after{
	content:" ";
	display: none;
	margin:0;
}


/* 中段contact 
**************************/

.contact{
	width:100%;
	margin:0 auto;
	padding:0px;
	background:url(../img/common/contact_bg.png) top left;
	background-size:contain;
	text-align:center;
	}	

.contact p.contact_text{
	font-size:120%;
	padding:30px 5% 0;
}
	
.contact .contact_middle{
	width: 84%;
    padding: 40px 8%;
	display:flex;
	justify-content: space-between;}

.contact_middle .layLeft{
	border-right:1px dotted #707070;
	}
	
.contact_middle .layLeft,
.contact_middle .layRight{
	width:36%;
	padding:0 7%;}

.contact_middle .layLeft .tel_title,
.contact_middle .layRight .mail_title{
	background-color:#FFF3D0;
}
.contact_middle .layLeft .middle_tel .b_hour{
	font-size:12px;}

.contact_middle .layRight .middle_mail{
	margin-top:10px;}

.contact_middle .layRight .middle_mail img{
	margin:0 auto;
	width:80%;}

/*.contact_middle .layLeft a{
	display: inline-block;
	background: url(../img/common/tel_.png) center / cover no-repeat;
}*/
.contact_middle .layRight a {
	display: inline-block;
	background: url(../img/common/contact_.png) center / contain no-repeat;
}

/*.contact_middle .layLeft a img,*/
.contact_middle .layRight a img {
	vertical-align: middle;
	transition: opacity .7s;
}
/*.contact_middle .layLeft a:hover img,*/
.contact_middle .layRight a:hover img {
	opacity: 0;
}

.contact_middle .layLeft a .middleTel:before {
	content: '';
	display: inline-block;
	background:url(../img/common/tel_icon.png) left top no-repeat;
	background-size: contain;
	width: 48px;
	height: 60px;
	margin-right: 5px;
}
.contact_middle .layLeft a .middleTel{
	color: #333;
	font-size: 36px;
	font-weight: bold;
	white-space: nowrap;
	display: flex;
	align-items: center;
	justify-content: center;
}
.contact_middle .layLeft a .middleTel:hover{
	opacity: 0.6;
	/*color: #ffcc00;*/
	-webkit-transition: all 0.7s;
    -moz-transition: all 0.7s;
    -ms-transition: all 0.7s;
    -o-transition: all 0.7s;
    transition: all 0.7s;
}
@media only screen and (max-width:1199px) {
.contact_middle .layLeft a .middleTel{
	font-size: 30px;
}
}
@media only screen and (max-width:999px) {
.contact_middle .layLeft a .middleTel{
	font-size: 158%;
}
.contact_middle .layLeft a .middleTel:before {
	width: 30px;
	height: 38px;
}
}
	
@media only screen and (max-width:828px){	
.contact .contact_middle{
	width: 90%;
    padding: 30px 5%;
}
.contact_middle .layLeft, .contact_middle .layRight {
    width: 44%;
    padding: 0 3%;
}
}

@media only screen and (max-width:560px) {
.contact .contact_middle{
	display:block;
}
	
.contact_middle .layLeft,
.contact_middle .layRight{ width:100%;}
	

.contact_middle .layLeft{
	padding:0;
	border-right:none;
}
.contact_middle .layRight{
	padding:0;
	margin-top:20px;
}
}
		
/* コンテンツ 
**************************/	
.box_inner{
   margin-top:-90px;
   padding-top:90px;
}

@media (max-width: 767px){
.box_inner{
   margin-top:-5px;
   padding-top:5px;
}
}
.case_bg_white{
	width:84%;
	padding:40px 8%;}
	
.case_bg_colored{
	width:84%;
	padding:40px 8%;
	background-color:#FFC832;}

.case_bg_gray{
	width:84%;
	padding:40px 8%;
	background-color:#f5f5f5;}

.case_bg_img{
	width:84%;
	padding:40px 8%;
	background:url(../img/common/in_bg.jpg) no-repeat top left;}

.case_bg_img02{
	width:84%;
	padding:40px 8%;
	background:url(../img/common/service_bg.jpg) no-repeat top right;}

@media only screen and (max-width:1199px){	
.case_bg_white,
.case_bg_colored,
.case_bg_gray,
.case_bg_img{
		width:90%;
		padding:30px 5%;
}
}
.box{
	padding-bottom:20px;
}

.box + .box{
	padding-top:20px;
	border-top:1px solid #CCC;}

.box_last{
	padding-top:20px;
	padding-bottom:20px;
	border-top:1px solid #CCC;
	}

.sub_title_basic{
	color: #ED0707;
	/*background-color:#f2f2f2;*/
	background-color:rgba(237,7,7,0.05);
	border-bottom: 2px solid #ddd;
	padding:10px;
	margin:50px 0 0;
	display:flex;
	align-items: center;
}
.sub_title_basic h3{
	/*color: #ED0707;*/
	color: #505050;
	margin:0;
	z-index:999;
}
.sub_title_basic a .middle_category{
    font-size: 12px;
	color:#444;
	margin:0px 15px 0 0;
	padding:0 15px 3px 15px;
	/*background:#FFF;*/
	border-right:1.5px solid #666;
	/*border-radius:3px;*/}

.sub_title_basic a:hover .middle_category{
	opacity:0.8;}

.sub_title_basic .num{
	background: #ED0707;
	color: #fff;
	font-weight: bold;
	padding: 3px 8px;
	margin-right: 15px;
}

@media only screen and (max-width:767px) {
.sub_title_basic{
	display:block;
}
.sub_title_basic a .middle_category{
	margin:0 0 5px;
	padding:0 0 3px 0;
	border-right: none;
	border-bottom:1px solid #666;
	display: inline-block;
}
}
.column{
	display:flex;
	margin-top:40px;}

.column .column_img{
	  flex: 0 0 33%;
	  max-width: 480px;
	  margin: 0 auto;
	}
.column .column_text{
	  flex: 0 0 66%;
	  padding: 0 0 0 30px;
	  box-sizing: border-box;}

.column .column_text p{
	margin-bottom:10px;
}
.column .column_text a:hover{
	text-decoration: underline;
	transition:07s;
}
#case .column .column_text p a{
	margin: 10px 0;
}

.column .column_text p a:hover{
	text-decoration: underline;
}

ul.disc{
	background:#f8f8f8;
	padding:20px 5%;
	margin-top:10px;
}

ul.disc li{
	list-style:disc;
	margin-bottom:10px;
	margin-left:1em;
	}

.column h4,
.column_under h4{
	padding-left:16px;
	position:relative;
}
.column_under h4{
	margin: 20px 0 10px;
	border-top: 1px solid #999;
	border-bottom: 1px solid #999;
	padding-top: 7px;
	padding-bottom: 7px;
}
.column h4:before,
.column_under h4:before{
  position: absolute;
  top:40%;
  left: 0;
  width: 6px;
  height: 6px;
  content: '';
  background: #ED0707;
 }
.column_under_box{
    /*background: #f8f8f8;*/
    padding: 30px 5%;
}
.column_under_box ul.disc{
	padding: 20px 5% 10px;
} 
  
#staff .column .column_img{
	  flex: 0 0 25%;
	  max-width: 300px;
	  margin: 0 auto 0 0;
	}
#staff .column .column_text{
	  flex: 0 0 74%;
	  padding: 0 0 0 30px;
	  box-sizing: border-box;}

.column_text dl dt{
	font-weight: bold;}

.column_text dl dd{
	margin: 5px 0;}

.column_text dl dd a:hover{
	text-decoration: underline;
}

.personnel{
	width: 50%;
	margin:0 auto 10px 0;
}
.personnel a:hover img{
	opacity: 0.8;
}

.row{
	display:flex;
	justify-content: space-between;
	margin-top:60px;}

.row .row_box{
	width:50%;
	margin:0 auto;
	display:flex;
	justify-content: space-between;
}
.row .row_box .course{
	width:45%;
	margin:0 auto;
}

.site_box{
	display:flex;
	justify-content: space-between;
	margin-bottom:20px;
}
.site_box  .course{
	width:25%;
	margin:0 auto;
}

.case_bg_gray .site_box  .course .course_box .figure{
	background:#FFF;
	border-radius:10px;
	padding:20px 0;
}
.case_bg_gray .site_box  .course .course_box .figure img{
	width:50%;
	margin:0 auto;
}
.course a .course_box{
	text-align:center;
	}
	
.course_box .figure{
	text-align:center;}

.course_box .figure .staff_illust{
	width: 80%;
	margin: 0 auto;
}

.course_box .course_text{
	margin-top:10px;
	text-align:center;}
	
.course_box .course_text h3.title{
	font-weight:bold;
	font-size: 100%;
	color:#333;
	margin:0 auto;
	display:block;}
	
.course_box .course_text:after {
content: '';
width: 0;
transition: all 0.3s ease;
border-bottom: 2px solid #ED0707;
padding-top:5px;
display: block;
}

.course a:hover .course_box .figure img{
	opacity:0.8;
	-webkit-transition: all 0.5s;
    -moz-transition: all 0.5s;
    -ms-transition: all 0.5s;
    -o-transition: all 0.5s;
    transition: all 0.5s;
	}
.course a:hover .course_box .course_text h3.title{
	color:#ED0707;
	-webkit-transition: all 0.5s;
    -moz-transition: all 0.5s;
    -ms-transition: all 0.5s;
    -o-transition: all 0.5s;
    transition: all 0.5s;}


.course a:hover .course_box .course_text:after{
	width: 100%;
	border-bottom: 2px solid #ED0707;
}

.course_box .course_text p.post{
	font-weight: bold;
}
.course_box .course_text p.position{
    color: #888;
    text-align: center;
    font-size: 12px;
    padding-top: 5px;
    letter-spacing: 1px;
}

@media only screen and (max-width:767px) {

.personnel{
	width: 80%;
	margin:0 auto 10px;
}
	
.row{
	margin-top:0;
	display:block;
}

.row .row_box{
	width:100%;
	margin-top:30px;
}

.site_box{
	display:block;
	margin-bottom:0;
}
.site_box  .course{
	width:100%;
	margin-top:20px;
}

.site_box  .course .course_box .figure{
	width:60%;
	margin:0 auto;
}
.course_box .figure{
	width:100%;
	margin:0 auto;
}

.course_box .course_text h3.title{
	font-size:16px;
	line-height:1.2em;
}
}
@media only screen and (max-width:767px) {

.column{
	display: block;
	margin-top:20px;
}
.column .column_img,
#staff .column .column_img{
	  width: 100%;
	  margin: 0 auto;
	}
.column .column_text,
#staff .column .column_text{
	  width: 100%;
	  padding: 20px 0 0 0}
}

.link_box{
	margin-top:50px;
	border:3px solid #EEE;
	border-radius:5px;
	padding:20px 5%;
	display:flex;}
	
ul.link_list{
	display:inline-block;}

ul.link_list li{
	display:inline-block;
	line-height:3em;}

ul.link_list li a span{
	color:#666;
	border:1.5px solid #CCC;
	background:	#f8f8f8;
	padding:5px 10px;
	font-size:85%;
	}
ul.link_list li a:hover span{
	color:#FFF;
	background-color:#ED0707;
	border:1.5px solid #ED0707;
	transition: 1.0s ;
}


.link_left{
	margin-right:30px;
	}

.link_left a img{
	max-width:200px;

}

.link_right a dl{
    text-align: left;
    letter-spacing: 1px;
	margin:0;
}

.link_right a dl dt{
    font-size: 100%;
	color: #444;
}

.link_right a dl dd{
    font-size: 12px;
	color: #888;
	margin:0;
}

.link_right ul.link_list{
	display:block;
	margin-top:20px;
}

.link_right ul.link_list li{
	display:inline-block;
}
.link_right .link_mail{
	display:block;
	margin:20px auto 0 0;
	text-align:left;
}

.link_right .link_mail a img{
	max-width:230px;	
}
.link_left a:hover img{
	opacity:0.8;
	transition: 1.0s ;
}
.link_right a:hover dl dt,
.link_right a:hover dl dd{
	color:#ED0707;
	transition: 1.0s ;
}

.link_right .link_mail a {
	display: inline-block;
	background: url(../img/common/contact_.png) center / contain no-repeat;
}

.link_right .link_mail a img{
	vertical-align: middle;
	transition: opacity .7s;
}
.link_right .link_mail a:hover img {
	opacity: 0;
}


@media only screen and (max-width:767px) {
.link_box{
	display:block;
}
.link_left{
	margin-right:0;
	text-align:center;
}
.link_left a img{
	margin:0 auto 15px;
}
.link_right a dl{
	margin:0;
	text-align:center;
}
.link_right ul.link_list {
    display: block;
    margin:0;
}
.link_right ul.link_list li{
	text-align:center;
    display: block;
	margin-top:20px;
}
.link_right ul.link_list li a{

}
.link_right ul.link_list li a span{
	width:80%;
	display:block;
	margin:0 auto;
	padding:0;
}
.link_right .link_mail{
	display:block;
	margin:20px auto 0;
	text-align:center;
}
}

/* リンクボタン 
**************************/
.link{
	width:30%;
	max-width:250px;
}

.link a .view{
	background-color:#FFF;
	color:#ED0707;
	font-weight: bold;
    position: relative;
	height:40px;
	border-radius:20px;
	display:flex;
	justify-content: center;
	align-items: center;
}

.link a .view:after {
    content: ">";
    color: #ED0707;
    font-size: 90%;
    font-weight: bold;
    position: absolute;
    right: 15px;
}


.link a:hover .view{
	background-color:#ED0707;
	color:#FFF;
	transition: 1.0s ;
}

.link a:hover .view:after {
    color: #FFF;
	transition: 1.0s ;
}
.column .column_text .link{
	margin:20px auto 0 0;
	min-width: 200px;
}

.greeting .layLeft .link{
	width:50%;
	max-width:250px;
	margin:0 auto 0 0;
}

.health_link .link{
	width:50%;
	max-width:350px;
	margin:0 auto 0 0;
}
.column .column_text .himawari .link{
	width:30%;
	max-width:400px;
	margin:20px auto 0 0;
}
.column .column_text p.himawari_txt{
	font-size: 90%;
	color: #666;
	margin:20px 0 0;
}

.topics .link a .view{
	border:1px solid #999;
}
.column .column_text .link a .view{
	border:1px solid #ED0707;
}

.topics .link a:hover .view,
.column .column_text .link a:hover .view{
	border:1px solid #ED0707;
}


@media only screen and (max-width:767px) {

.link{
	width: 70%;
    max-width: 300px;
}

.greeting .layLeft .link,
.health_link .link{
	width: 70%;
    max-width: 300px;
	margin:0 auto;	
}
.column .column_text .himawari .link{
	width: 70%;
    max-width: 300px;
	margin:20px auto 0;		
}
.column .column_text .link {
	margin:20px auto 0;
}
}

/* パッケージシステム導入支援
**************************/
.package{
	background: #f8f8f8;
	margin-top: 20px;
	padding: 1px 0 30px;
}
.list_package{
	display: flex;
	justify-content: space-between;
	margin-top: 30px;
}
.list_package li{
	width: 33%;
	margin: 0 auto;
}
.list_package_item{
	width: 90%;
	margin: 0 auto;
	padding: 0;
	background: #fff;
	height: 100%;
	border-radius: 5px;
	box-shadow:  2px 2px 3px rgba(204,204,204, .4);
}
.list_package_item dt{
	background: #666;
	color: #fff;
	padding: 10px 22px 10px 10px;
	margin-bottom: 20px;
	min-height: 45px;
	line-height: 1.3;
	border-radius: 5px 5px 0 0;
	position: relative;
}
.list_package_item dt span:after{
	content: ">";
	width: 18px;
	height: 18px;
	display: inline-block;
	position: absolute;
	right:2px;
}
.list_package_item dd{
	margin: 0 auto;
	padding: 0 5% 15px;
	font-size: 90%;
	color: #444;
}
.list_package li a:hover .list_package_item{
	box-shadow:  2px 2px 6px rgba(204,204,204, .9);
	transition: 0.7s ;
}
.list_package li a:hover .list_package_item dt{
	background: #999;
	color: #fff;
	transition: 0.7s ;
}
.list_package li a:hover .list_package_item dd{
	color: #ED0707;
	transition: 0.7s ;
}
.list_package li a:hover .list_package_item dd img{
	opacity: 0.8;
}
@media only screen and (max-width: 767px){
.list_package{
    display: block;
	margin-top: 0;
}
.list_package li{
	width: 100%;
	margin: 30px auto 0;
}
.list_package li.no_box{
	display: none;
	}
.list_package_item dt{
	min-height: auto;
}
}

/* 配車勤怠クラウド
**************************/
.list_table{
	background: #fff;
}
.list_cloud{
	display: flex;
	justify-content: space-between;
	margin-top: 30px;
}
.list_cloud li{
	width: 30%;
	margin: 0 auto;
}
.list_cloud_item{
	width: 100%;
	margin: 0 auto;
	padding: 0;
	background: #fff;
	height: 100%;
}
.list_cloud_item dt{
	color: #444;
	font-weight: bold;
	line-height: 1.3;
	min-height: 32px;
	margin-bottom: 15px;
}
.list_cloud_item dt span.num{
	display: inline-block;
	background:#ED0707;
	color: #fff;
	font-weight: bold;
	width: 20px;
	height: 20px;
	margin-right: 10px;
	text-align: center;
}
.list_cloud_item dd{
	margin: 0 auto;
	padding: 0 0 15px;
	color: #444;
}
@media only screen and (max-width: 767px){
.list_cloud{
    display: block;
	margin-top: 0;
}
.list_cloud li{
	width: 100%;
	margin: 30px auto 0;
}
.list_cloud_item dt{
	min-height: auto;
}
}
.cloud_inner{
	width: 96%;
	margin: 0 auto;
}
.table_function{
	background: #f8f8f8;
	padding: 10px 5% 30px;
}
.style_num{
	display: flex;
	justify-content: space-between;
	margin-top: 20px;
}
.style_num li{
	width: 20%;
	margin: 0 auto;
}
.style_num li a{
	color: #444;
	text-decoration: underline;
	transition: 0s;
}
.style_num li a:hover{
	color: #ED0707;
	text-decoration: underline;
	transition: 0s;
}
.cloud_price{
	border: 1px solid #ccc;
	border-collapse: collapse;
  　border-spacing: 0;
	margin-bottom: 20px;
	width: 100%;
}
.cloud_price th{
	background: rgba(237,7,7,0.05);
	border-right:1px solid #ccc;
	border-bottom:1px solid #ccc;
	padding: 10px 15px;
}
.cloud_price td{
	background: #fff;
	border-bottom:1px solid #ccc;
	padding: 10px 30px;
}
.cloud_flow li {
	margin-bottom: 10px;
}
.cloud_flow li:after{
	content: "▼";
	display: block;
	width: 30px;
	height: 20px;
	color: #ccc;
	margin: 5px 0 0 10px;
}
.cloud_flow li:last-child:after{
	content: "";
} 
.cloud_flow li h4{
	/*background: rgba(237,7,7,0.05);
	padding: 10px 30px;*/
	font-weight: bold;
	font-size: 110%;
    color: #444;
	margin: 0;
}
.cloud_flow a:hover{
	text-decoration: underline;
	transition:07s;
}
@media only screen and (max-width: 767px){
.cloud_inner{
	width: 100%;
}
.style_num{
	display: block;
	margin-top: 0;
}
.style_num li{
	width: 100%;
	margin: 10px auto 0;
}
#fun01,
#fun02,
#fun03,
#fun04,
#fun05,
#fun06,
#fun07,
#fun08,
#fun09,
#fun10,
#fun11,
#fun12{
	display: flex;
    align-items: center;
	}
}
/* 見出し背景(業種別)
**************************/
#industry01{
	background:url(../img/common/truck_bg.jpg) top left;
	background-size:cover;
	height:150px;
	text-align:center;
	display:flex;
	justify-content: center;
	align-items: center;
}
.industry_pic{
	width: 90%;
	margin: 30px auto 0;
}
.industry_pic .industry_pic_sp{
	display: none;
}
@media only screen and (max-width:767px) {
.industry_pic{
	width: 100%;
}
.industry_pic .industry_pic_pc{
	display: none;
}
.industry_pic .industry_pic_sp{
	display: block;
}
}
#industry02{
	background:url(../img/common/btob_bg.jpg) top left;
	background-size:cover;
	height:150px;
	text-align:center;
	display:flex;
	justify-content: center;
	align-items: center;
}
#industry03{
	background:url(../img/common/estate_bg.jpg) top left;
	background-size:cover;
	height:150px;
	text-align:center;
	display:flex;
	justify-content: center;
	align-items: center;
}

@media only screen and (max-width:767px) {
#industry01,
#industry02,
#industry03{
	height:100px;
	padding:0 5%;}
}

/* 表(会社案内)
**************************/
.table-striped-white,
.table-striped-colored{
	width:100%;
	border-collapse: collapse;
	box-sizing: border-box;}

.table-striped-white tbody tr{
	border-top: 1px solid #ddd;
	border-bottom: 1px solid #ddd;
	text-align:left;
}

.table-striped-white tr:nth-child(odd){
	background-color: #f9f9f9;
}
.table-striped-white tr:nth-child(even){
	background-color: rgba(255,255,255,0.3);
}
/*.table-striped-colored tr:nth-child(odd){
	background-color: rgba(255,255,255,0.6);
}
.table-striped-colored tr:nth-child(even){
	/*background-color: #FFC832;
	background-color: rgba(255,255,255,0.3);
}*/

.table-striped-colored tbody tr{
	border-top: 1px solid #ddd;
	border-bottom: 1px solid #ddd;
	text-align:left;
}


.table-striped-white th,
.table-striped-colored th{
	width:150px;
	padding: 8px 15px;
}
.table-striped-colored th{
	text-align: left;
}
.table-striped-white td,
.table-striped-colored td{
	padding: 15px 8px;
}
.table-striped-colored td .month{
	text-align: right;
	color: #999;
	padding-right: 30px;
	display: table-cell;
	width: 66px;
}
.table-striped-colored td span{
	display: table-cell;
}
@media only screen and (max-width:767px) {
.table-striped-white,
.table-striped-colored{
	margin-top:30px;
}
.table-striped-white th,
.table-striped-colored th{
	width:80px;
}
}
@media only screen and (max-width:560px) {

.table-striped-white th{
	display:block;
	width:100%;
	padding: 8px 15px;
	background-color: #f9f9f9;
	box-sizing: border-box;
}
.table-striped-colored th{
	display:block;
	width:100%;
	padding: 8px 15px;
	background-color: #efefef;
	box-sizing: border-box;
}
.table-striped-white td{
	display:block;
	width:100%;
	padding: 10px 15px;
	background-color: #FFF;
	box-sizing: border-box;
}
.table-striped-colored td{
	display:block;
	width:100%;
	padding: 10px 15px 10px 0;
	box-sizing: border-box;
}
.table-striped-colored td .month{
	padding-right: 20px;
}
}
/* 表(スタッフ紹介)
**************************/
.table-staff{
	width:100%;
	border-collapse: collapse;
	box-sizing: border-box;
	margin-top:30px;
	border-top:1px solid #EEE;
	border-bottom:1px solid #EEE;
	text-align:left;}

.table-staff th{
	width:30%;
	padding: 15px;
	background-color:#e9e9e9;
	border-bottom:1px solid #FFF;
	vertical-align:top;
	box-sizing: border-box;
	vertical-align: middle;
	text-align: center;
}

.table-staff td{
	width:70%;
	padding: 5px 15px;
	border-bottom:1px solid #EEE;
	box-sizing: border-box;
}

.table-staff td p{
	margin:20px 0 10px;
}

.table-staff td ul{
	margin:10px 0;
}
.table-staff td ul li{
	list-style:square;
	margin-left:20px;
	color: #888888;
}

.table-staff td ul li span {
  color: #444444;
}

.table-staff td dl {
	margin:0 0 10px;
}
.table-staff td dl dt{
	margin-top:10px;}
	
.table-staff td dl dd{
	display: list-item;
	list-style-type: square;
	margin-left:20px;
	color:#FFC832;
}
.table-staff td dl dd span {
  color: #444444;
}

@media only screen and (max-width:767px) {
.table-staff{
	margin-top:30px;
	border:1px solid #e9e9e9;
}
.table-staff th,
.table-staff td{
	width:100%;
	display:block;
	padding:10px 15px;
	border-bottom:0px;
	text-align: left;}
}

.slogan{
	margin-top: 60px;
}
/* トピックス
**************************/

.news_area{
	text-align: left;
    display: flex;
	justify-content: space-between;
	margin-top:30px;
}
.content-area {
	width:100%;
    padding: 0 50px 0 0;
}

.entry-title {
    text-align: left;
    font-size: 24px;
    font-weight: bold;
    margin: 2px 0 4px;
	padding-bottom:5px;
    line-height: 1.2;
	border-bottom:3px solid #999;
}

.entry-meta{
    margin: 0 0 15px;
    display: block;
}

/*
.entry-meta .posted-on {
    font-size: 12px;
    color: #999;
    display: inline-block;
	margin-left:10px;
}*/

.entry-content {
    border-bottom: 1px dotted #999;
    padding: 0 0 30px;
    margin: 30px 0;
}

.entry-content p{
	line-height:1.6;
}

.entry-content p strong{
	color:#f2b205;
	text-decoration:underline;
}

.entry-content p span{
	color:#f2b205;
	font-weight: bold;
}

.widget-title {
    font-size: 18px;
    padding-bottom: 8x;
    margin: 0 0 20px;
	position: relative;
    border-bottom: 3px solid #CCC;
    border-radius: 1.5px;
}
.widget-title:before {
    position: absolute;
    bottom: -3px;
    left: 0;
    width: 20%;
    height: 3px;
    content: '';
    background: #ED0707;
}

.widget a{
	color:#444;
}
.widget-area {
    font-size: 16px;
	min-width:200px;
}

.widget-area .encircle{
	border:1px solid #CCC;
    padding: 8px 10px;
}

.widget ul {
    margin: 0 0 15px;
}
.widget ul li {
    margin: 0 0 5px;
	line-height:1.2;
}

.widget ul li a{
	font-size:85%;
}

.widget ul li a:hover{
	color: #ED0707;
	transition: none;
}


/*.widget .post-date {
    font-size: 12px;
    color: #999;
    display: block;
}*/

.pagingArea{
	overflow:auto;
	margin-top:10px;
	}

.pagingArea .pagingPast{
	float:left;
	text-align:left;
	width:50%;
	font-size:85%;
}

.pagingArea .pagingNext{
	float:right;
	text-align:right;
	width:50%;
	font-size:85%;
}

.pagingArea .pagingPast a:hover,
.pagingArea .pagingNext a:hover{
	text-decoration:underline;
}

@media only screen and (max-width:767px){
.news_area {
    display: block;
    margin: 20px auto;
    padding: 20px 0 1px;
}

.content-area{
    padding: 0;
}
.widget-area{
	border-bottom:1px solid #CCC;
	margin-top:30px;
	padding: 0;
}
.entry-title{
	font-size: 18px;
}
.widget-title {
	font-size: 15px;
}
}
.staff_topics{
	margin:20px 0 0;}

.staff_topics ul li{
	margin-bottom:10px;}
		
.topics_category{
	display:inline-block;
	color:#888;
	}
	
/*.seminar a{ color:#eb6877;}
.public a{ color:#8fc31f;}
.management a { color:#e2a42b;}
.technology a{ color:#0068b7;}*/
.topics_category a{ color:#888;}

.topics_category a:hover{
	opacity:0.8;}
	
.staff_topics .newstitle a{
	color: #333333;
    margin: 0;}

@media only screen and (max-width:480px) {
.staff_topics .newstitle{
	margin:0;
	display:block;
}
}
.performance {
	margin:20px 0 0;}

.performance dl{
	margin:0;
}
.performance dl dt{
	margin-top:10px;
	}
.performance dl dd{
	margin-left:20px;
}	

.performance ul li{
	margin-bottom:5px;
}


/* 採用
**************************/
.objective{
	max-width:600px;
	margin: 0 auto;
	}

.objective ul li{
	position:relative;
	padding-left:30px;
	margin-bottom:10px;
	font-weight:bold;
}
.objective ul li:before{
	position:absolute;
	top:3px;
	left:0;
	content:"";
	display:inline-block;
	background:url(../img/common/check.png) bottom left;
	background-size:contain;
	width:20px;
	height:20px;
}

/* 健康
**************************/
.photo_box{
	display:flex;
	justify-content:space-between;}

.photo_box li {
	width:30%;
	margin:30px 0;}

@media only screen and (max-width:767px) {
.photo_box{
	display:block;}

.photo_box li {
	width:100%;
	margin:30px 0;}
}
	
/* お問い合わせフォーム 
**************************/

.formtext{
	width:100%;
	margin-top:30px;
	text-align:center;
}

.formtext #mail_form{
	height: 560px;
	max-width: 600px;
	width: 90%;
	margin:30px auto 0;
	border: 0;
	display:block;
	overflow:scroll;
}
.formnotes{
	text-align: left; 
	border-top: 1px solid #CCC;
	border-bottom: 1px solid #CCC;
	max-width:800px;
	padding: 30px 10px 20px;
	margin: 30px auto 40px;
}
.formnotes ul li{
	font-size: 95%;
	margin-bottom: 10px;
	padding-left: 1.5em;
	text-indent: -1.5em;
}
.external_form{
	width: 80%;
	max-width: 960px;
	margin: 30px auto;
}
@media only screen and (max-width:999px) {
.external_form{
	width: 100%;
}
}
/* 下層/サービス一覧・業種一覧
**************************/
.list{
	}

.list ul{
	display: flex;
	justify-content: space-around;
	text-align:center;}

.list ul a{
	width:40%;
}
.list ul a li{
	width:100%;
	height:46px;
	margin: 0 auto;
	/*border-radius:23px;*/
	/*background-color:#FFF;*/
	display: flex;
	justify-content: center;
	align-items: center;
	position:relative;
	font-weight:bold;
	}

.list ul a li{
	color:#333;
}

.list ul a li span{
	position:relative;
	margin-left:10px;}

.list ul a li.list_service span:before {
	position: absolute;
	top:2px;
	left:-30px;
	content:"";
	display:inline-block;
	background:url(../img/common/list_service.png) top left;
	background-size:cover;
	width:20px;
	height:20px;
}
.list ul a li.list_industry span:before {
	position: absolute;
	top:2px;
	left:-30px;
	content:"";
	display:inline-block;
	background:url(../img/common/list_industry.png) top left;
	background-size:cover;
	width:20px;
	height:20px;
}
/*.list ul a li:after {
    content: ">";
    color: #ED0707;
    font-size: 90%;
    font-weight: bold;
    position: absolute;
    right: 15px;
}*/
.list ul a li:before {
    content: " ";
	display: inline-block;
	background: url(../img/common/list_frame_left.png) top left no-repeat;
	width: 20px;
	height: 20px;
	background-size: contain;
    position: absolute;
	left: 30px;
	top: 0;
}
.list ul a li:after {
    content: " ";
	display: inline-block;
	background: url(../img/common/list_frame_right.png) bottom right no-repeat;
	width: 20px;
	height: 20px;
	background-size: contain;
    position: absolute;
    right: 30px;
	bottom: 0;
}
.list ul a:hover li{
	color:#ED0707;
}
.list ul a:hover li span{
	font-size: 110%;
	transition: 1.0s ;
}
.list ul a:hover li:before {
    content: " ";
	display: inline-block;
	background: url(../img/common/list_frame_left_on.png) top left no-repeat;
	width: 20px;
	height: 20px;
	background-size: contain;
    position: absolute;
	left: 20px;
	top: 0px;
	transition: 1.0s ;
}
.list ul a:hover li:after {
    content: " ";
	display: inline-block;
	background: url(../img/common/list_frame_right_on.png) bottom right no-repeat;
	width: 20px;
	height: 20px;
	background-size: contain;
    position: absolute;
    right: 20px;
	bottom: 0px;
	transition: 1.0s ;
}
/*.list ul a:hover li:after{
    color: #FFF;
	transition: 1.0s ;
}

.list ul a:hover li.list_service span:before {
	position: absolute;
	top:2px;
	left:-30px;
	content:"";
	display:inline-block;
	background:url(../img/common/list_service_on.png) top left;
	background-size:cover;
	width:20px;
	height:20px;
	transition: 1.0s ;
}
.list ul a:hover li.list_industry span:before {
	position: absolute;
	top:2px;
	left:-30px;
	content:"";
	display:inline-block;
	background:url(../img/common/list_industry_on.png) top left;
	background-size:cover;
	width:20px;
	height:20px;
	transition: 1.0s ;
}*/
@media only screen and (max-width:999px) {
.list ul a li:before,
.list ul a:hover li:before {
	left: 0px;
}
.list ul a li:after,
.list ul a:hover li:after {
    right: 0px;
}
}
@media only screen and (max-width:767px) {

.list ul{display:block;}

.list ul a{ width:100%;}

.list ul a li{
	margin-bottom:10px;}
}

/* info/バナー群
**************************/

.info{
	display:flex;
	justify-content: space-between;
	background-color:#FFF;}
	
.info_each{
	width:30%;
}

.info .line{
	width:1px;
	height:auto;
	background-color:#ccc;
}

.info_each .info_icon{
	width:25%;
	margin:0 auto;
}

.info_each .headline h2{
	font-size:150%;
	}
	
.info_each a:hover .headline h2{
	color:#ED0707;
	transition: color 0.5s ease 0s;}
.info_each a:hover .headline span{
	color:rgba(237,7,7,0.4);
	transition: color 0.5s ease 0s;}
	

@media only screen and (max-width:767px) {
.info{
	display:block;
}
.info_each{
	width:100%;
}
.info .line{
	width:100%;
	height:1px;
	margin-top:20px;
}
.info_each .info_icon{
	width:20%;
}
.info_each .headline h2{
	font-size:20px;
	}
}
.info_each .headline span{
	font-size:70%;
	}
	
.banner{
	display:flex;
	justify-content: space-between;
	background-color:#FFF;
	height:200px;}
	
.bn_each{
	width:22%;
	position: relative;
	text-align:center;
}

.bn_each .bn_icon{
	width:60%;
	left: 50%;
    position: absolute;
    top: 40%;
}
.bn_each .bn_icon img{
	transform: translate(-50%,-50%);
	min-width: 100px;
	max-width: 280px;
	margin: auto;
}
.bn_each p{
	margin:0 auto;
	font-size:12px;
	line-height: 1.5;
	color:#666;
	position:absolute;
	top:80%;
	bottom:0;
	text-align:center;
}

.bn_each a:hover{
	opacity:0.6;
	transition: 0;}

.support{
	display:flex;
	justify-content: space-between;
	padding-top:40px;
	border-top:1px dotted #999;}
	
.support_each{
	width:30%;
	overflow:hidden;
}
	
.support_each a .support_box{
}

/*.support_each a .support_box .layBottom{
	text-align:center;
	padding:10px;
	display:flex;
	justify-content: center;
	align-items: center;}

.support_each a .support_box .layBottom .support_title span{
	color:#333333;
	border-bottom:1px solid #333;}
	
.support_each a .support_box .layBottom .support_title h3{
	margin:0 auto;
	color:#333333;}

.support_each a .support_box .layTop {
	width:70%;
	margin:0 auto;
}

.support_each a .support_box .layTop img{

}

.support_each a:hover .support_box .layTop img{
	opacity:0.8;}

.support_each a:hover .support_box .layBottom .support_title span{
	color:#ED0707;
	border-bottom:1px solid #ED0707;}
	
.support_each a:hover .support_box .layBottom .support_title h3{
	color:#ED0707;
}*/
@media only screen and (max-width:999px) {
.bn_each p{
	top:70%;
}
}
@media only screen and (max-width:767px) {
.banner{
	display:block;
	height:auto;}

.bn_each{ width:100%;}

.bn_each .bn_icon{
	margin:0 auto;
    position:static;
}
.bn_each .bn_icon img{
	transform:none;
}

.bn_each p{
	position:static;
	margin:10px auto 40px;
}

.support{display:block;}

.support_each{ width:100%;}
}

/* footer 
**************************/

footer{
	background:#333;
	color:#FFF;
	text-align:center;}

.footerInner{
	display:flex;
	justify-content: space-between;
	background-color: #333;
	padding:0 8% 20px;}

.footerInner .footLeft{
	width:100%;
	display:flex;
	justify-content: space-between;
}
	
.footerInner .footLeft .footMenu{
	width:20%;
	text-align:left;}

	
.footerInner .footMenu a{
	color:#FFF;}
	
.footerInner .footMenu ul li{
	font-size:90%;
	margin-left:5%;
	padding-left: 1em;
	text-indent: -1.3em;
	line-height: 1.2;
	margin-top: 10px;
	}
.footerInner .footMenu ul li ul li{
	padding-left: 0;
	text-indent: 0;
	}

.footerInner .footMenu ul li a{
  text-decoration: none;
}

.footerInner .footMenu ul.sub-menulist li:last-child{
	margin-bottom:30px;
	}
.footerInner .footMenu ul.sub-menulist li{
	margin-top: 10px;
	line-height: 1.1;
}

.footerInner .footMenu ul li.biglist{
	font-weight:bold;
	font-size:100%;
	margin-left:0;
	margin-top:30px;
	margin-bottom:10px;
	border-bottom:1px #FFF solid;
	padding-bottom:2px;
	color:#FFF;}

.footerInner .footMenu ul li.biglist_{
	margin-top:40px;
}
	
.footerInner .footMenu ul li a:hover,
.foot_logo ul li a:hover{
	opacity:0.5;
	transition: 0;
}
	
.p_policy {
	color:#FFF;}

.foot_logo{
	background-color:#666;
	padding:5px 20%;}

.foot_logo ul{
	display:flex;
	justify-content: center;
    align-items: center;}
	
.foot_logo ul li{
	width:30%;
	margin:0 atuo;
	font-size:90%;
}

.foot_logo ul li img{
	max-width:200px;}

.foot_logo ul li a{
	color:#FFF;}

.credit{
	margin-top:8px;
	padding-bottom:8px;
	font-size:10px;}


/* ページトップへ戻るボタン 
**************************/

/*#page_top{
  width: 50px;
  height: 50px;
  position: fixed;
  right: 0;
  bottom: 0;
  background: #333;
  opacity: 0.8;
}

}*/

#page_top{
	display:block;
	width: 50px;
	height: 50px;
    right: 10px;
    bottom: 0;
	z-index:999;
	background: #333;
	opacity: 0.8;
	position:fixed;
	float:right;
	clear:both;}
	
#sp_bottom{
	display:none;}
  
#page_top a{
  position: relative;
  display: block;
  width: 50px;
  height: 50px;
  text-decoration: none;
}
#page_top::before{
  font-family: 'Font Awesome 5 Free';
  font-weight: 900;
  content: '\f106';
  font-size: 25px;
  color: #fff;
  position: absolute;
  width: 25px;
  height: 25px;
  top: 0;
  bottom: 0;
  right: 0;
  left: 0;
  margin: auto;
  text-align: center;
}


/* アニメーション 
**************************/
.js-animation {
  opacity: 0;
  visibility: hidden;
  transform: translateY(40px);
  transition: all 1s;
}
.js-animation.is-show {
  opacity: 1;
  visibility: visible;
  transform: translateY(0px);
}



@media only screen and (max-width:1320px){
.middle_info ul{ width:50%;}
.middle_info .c_form{ width:35%;}
	}
		
@media only screen and (max-width:1199px){

.middle_info ul{ width:55%;}
.middle_info .c_form{ width:40%;}
	
.footerInner{padding:0 5% 20px;}
	}
	

		
@media only screen and (max-width:828px){	

/*header .logo{
	width:46%;
	margin-right:2%;}*/
	
header .info{
	width:32%;
	margin-right:2%;}

header .form{
	width:18%;}
	
}

@media only screen and (max-width:767px) {
	/**************************
/* ハンバーガーメニュー
**************************/

header#header{
	display:flex;
    box-shadow: 0px 2px 4px rgba(153,153,153,0.3);
	position:relative;
}
	
header .logo{
	order: 1;
	width: 100%;
    margin-right: 0;
}

header .contact_top{
	display:none;
}

#nav-drawer {
    padding-top: 0;
}

header .headerInner{
    padding: 8px 0 5px;
    position: static;
    height: auto;
    box-shadow: none;
    z-index: inherit;
	text-align:center;

}
header .logo .logo_icon{
	 justify-content: center;
}
header .logo{
	float:none;}
/*チェックボックス等は非表示に*/
.nav-unshown {
  display:none;
}


	
/*アイコンのスペース*/
#nav-open {
  width: 25px;
  height: 25px;
  vertical-align: middle;
  cursor: pointer;
  display: block;
  position:absolute;
  top:0;
  bottom:0;
  margin: auto;
}

/*ハンバーガーアイコンをCSSだけで表現*/
#nav-open span, #nav-open span:before, #nav-open span:after {
  position: absolute;
  height: 2px;/*線の太さ*/
  width: 25px;/*長さ*/
  border-radius: 3px;
  background: #555;
  display: block;
  content: '';
  cursor: pointer;
}
#nav-open span:before {
  bottom: -8px;
}
#nav-open span:after {
  bottom: -16px;
}

/*閉じる用の薄黒カバー*/
#nav-close {
  display: none;/*はじめは隠しておく*/
  position: fixed;
  z-index: 99;
  top: 0;/*全体に広がるように*/
  left: 0;
  width: 100%;
  height: 100%;
  background: black;
  opacity: 0;
  transition: .3s ease-in-out;
}

/*中身*/
#nav-content {
  display:block;
  -webkit-overflow-scrolling: touch;
  overflow: auto;
  position: fixed;
  top: 0;
  left: 0;
  z-index: 9999;/*最前面に*/
  width: 80%;/*右側に隙間を作る（閉じるカバーを表示）*/
  max-width: 330px;/*最大幅（調整してください）*/
  height: 100%;
  background: #fff;/*背景色*/
  transition: .3s ease-in-out;/*滑らかに表示*/
  -webkit-transform: translateX(-105%);
  transform: translateX(-105%);/*左に隠しておく*/
}

#nav-content ul li.current-menu-item strong,
#nav-content ul li.current-menu-item span{
display:block;
padding-left:0;
font-family:"ヒラギノ角ゴ Pro W3","Hiragino Kaku Gothic Pro","メイリオ",Meiryo,Osaka,"ＭＳ Ｐゴシック","MS PGothic",sans-serif;}

#nav-content ul li.current-menu-item .item-title{
font-size: 100%;
line-height: 1.3em;
font-weight:700;
background-color:#FC0;
padding:7px 5%;
color:#500606;
border-bottom:1px solid #FFF;
text-align:left;}

#nav-content ul li.current-menu-item img{
	width:80%;
	margin:20px auto 0;}
	
#nav-content ul li.current-menu-item a img.off{
	display:block;
}
#nav-content ul li.current-menu-item a img.on{
	display:none;
}
#nav-content ul li.current-menu-item a:hover img.off{
	display:none;
}
#nav-content ul li.current-menu-item a:hover img.on{
	display:block;
}

#nav-content ul li.current-menu-item a .sp_sideTel:before{
	content: '';
	display: inline-block;
	background:url(../img/common/tel_icon.png) left top no-repeat;
	background-size: contain;
	width: 30px;
	height: 38px;
	margin-right: 5px;
}
#nav-content ul li.current-menu-item a .sp_sideTel{
	color: #333;
	font-size: 158%;
	font-weight: bold;
	white-space: nowrap;
	display: flex;
	align-items: center;
	justify-content: center;
	margin-top: 10px;
}
#nav-content ul li.current-menu-item a .sp_sideTel:hover{
	opacity: 0.6;
	/*color: #ffcc00;*/
	-webkit-transition: all 0.7s;
    -moz-transition: all 0.7s;
    -ms-transition: all 0.7s;
    -o-transition: all 0.7s;
    transition: all 0.7s;
}
	
#nav-content ul li.current-menu-item .item-title a:hover,
#nav-content li.current-menu-item li a{ color: #924fae;}

#nav-content ul.sub-menu{ padding:0 5%;}

/*チェックが入ったらもろもろ表示*/
#nav-input:checked ~ #nav-close {
  display: block;/*カバーを表示*/
  opacity: .5;
}

#nav-input:checked ~ #nav-content {
  -webkit-transform: translateX(0%);
  transform: translateX(0%);/*中身を表示（右へスライド）*/
  box-shadow: 6px 0 25px rgba(0,0,0,.15);
}

#mainNav{
display:none;
}

#nav-content li.current-menu-item li a{
color:#333;
display: block;
padding:5px 10px 5px 40px;
text-align:left;
font-size: 94%;
line-height: 1.3em;
border-bottom:1px solid #f1f1f1;
	position:relative;}

#nav-content li.current-menu-item li a:before{
	  font-family: 'Font Awesome 5 Free';
	  font-weight: 700;
	  content: '\f0da';
	  font-size: 10px;
	  color: #500606;
	  position: absolute;
 	  width: 10px;
 	  height: 10px;
	  top: 0;
	  bottom: 0;
	  left: 15px;
	  margin: auto;}

#nav-content ul > li:last-child a{border:0;}
#nav-content li li:last-child a{}

#nav-content li.current-menu-item a,
#nav-content li.current-menu-item a,
#nav-content li a:active{
color:#555;
}
#nav-content li a:hover,
#nav-content li li.current-menu-item a,
#nav-content li.current-menu-item li a:hover,
#nav-content li.current-menu-item li a:active{
color:#666666;
}

#nav-content li li{
float:none;
border:0;
}


/*-- アコーディオン-*/
#nav-content .menu {
    max-width: 600px;
}

#nav-content .menu a {
    display: block;
    text-decoration: none;
	line-height: 1;
    color: #FFF;
}

#nav-content label {
    display: block;
    margin: 0 0 1px 0;
    padding : 15px;
    line-height: 1;
    color :#FFF;
    background : #333;
    cursor :pointer;
}

#nav-content .menu ul li a {
	margin:10px 0;
    padding : 0 15px;
	color: #333;
}


#nav-content input {
    display: none;
}

#nav-content .menu ul {
    margin: 0;
    padding: 0;
    background :#f4f4f4;
    list-style: none;
}

#nav-content .menu li {
    height: 0;
    overflow: hidden;
    -webkit-transition: all 0.5s;
    -moz-transition: all 0.5s;
    -ms-transition: all 0.5s;
    -o-transition: all 0.5s;
    transition: all 0.5s;
}

#nav-content  #menu_bar01:checked ~ #links01 li,
#nav-content  #menu_bar02:checked ~ #links02 li,
#nav-content  #menu_bar03:checked ~ #links03 li,
#nav-content  #menu_bar04:checked ~ #links04 li,
#nav-content  #menu_bar05:checked ~ #links05 li,
#nav-content  #menu_bar06:checked ~ #links06 li {
    height: 36px;
    opacity: 1;
}

#nav-content label{
	position:relative;}

/*#nav-content .menu_bar_item:after{
	font-family: 'Font Awesome 5 Free';
	content: '\f105';
	font-size: 20px;
	color: #FFF;
	position: absolute;
 	width: 20px;
 	height: 20px;
	top: 0;
	bottom: 0;
	right:10%;
	margin: auto;
}*/
#nav-content .menu_bar_item{
	display: inline-block;
}
#nav-content label .fas{
	color: #FFF;
	position: absolute;
 	width: 20px;
 	height: 20px;
	top: 0;
	bottom: 0;
	right:0;
	margin: auto;
	display: inline-block;
}
/*-トップページへ戻る--*/
/*#page_top,
#page_top::before{
	display:none !important;}*/
#page_top{
  right: 0;
  width: 30px;
  height: 30px;
	}
#page_top a{
  width: 30px;
  height: 30px;
	}
#page_top::before{
  font-size: 15px;
  width: 15px;
  height: 15px;
	}
#sp_bottom{
	display:flex;
	 justify-content:flex-end;
	 width:100%;
	 height: 50px;
     position: fixed;
     right: 0;
     bottom: 0;
     background:rgba(255,255,255,0.8);
	 /* box-shadow: 0px -2px 3px rgba(153,153,153,0.5);*/
	 z-index:999;
	 flex: 1 1 auto;
	 border-top:1px solid #EEE;}
	 
#sp_bottom .b_info{
	width:100%;
	max-width:717px;
	min-width:180px;
	display:flex;
	justify-content:flex-start;}
	
#sp_bottom .b_info .b_tel{
	width: 42.5%;
	display:flex;
	justify-content:  center;
	align-items: center;
	/*	background:#eee;*/}

#sp_bottom .b_info .b_tel a{
	display: block;
	height:45px;
	width:90%;
	margin: auto auto auto 10%;
	/*background: url(../img/common/tel.png) center / contain no-repeat;*/}
	
#sp_bottom .b_info .b_tel a .sp_bottomTel:before {
	content: '';
	display: inline-block;
	background:url(../img/common/tel_icon.png) left 50% no-repeat;
	background-size: contain;
	width: 30px;
	height: 38px;
	margin-right: 5px;
}
#sp_bottom .b_info .b_tel a .sp_bottomTel{
	color: #333;
	font-size: 158%;
	font-weight: bold;
	white-space: nowrap;
	display: flex;
	align-items: center;
}
#sp_bottom .b_info .b_tel a .sp_bottomTel:hover{
	opacity: 0.6;
	/*color: #ffcc00;*/
	-webkit-transition: all 0.7s;
    -moz-transition: all 0.7s;
    -ms-transition: all 0.7s;
    -o-transition: all 0.7s;
    transition: all 0.7s;
}
#sp_bottom .b_info .b_form{
	width: 42.5%;
	display:flex;
	justify-content:  center;
	align-items: center;
	}

#sp_bottom .b_info .b_form a{
	height:45px;
	width:90%;
	margin: auto;
	background: url(../img/common/contact.png) center / contain no-repeat;}

#sp_bottom .b_info .b_tel a img,
#sp_bottom .b_info .b_form a img {
	vertical-align: middle;
	transition: opacity .7s;
}
/*#sp_bottom .b_info .b_tel a:hover{
	background: url(../img/common/tel_.png) center / contain no-repeat;
}*/
#sp_bottom .b_info .b_form a:hover {
	background: url(../img/common/contact_.png) center / contain no-repeat;

}
#sp_bottom .b_info #burger{
	width: 15%;
    display: flex;
    flex-flow: column;
    align-items: center;
    justify-content: center;
    flex: 1 1;
}
	
/*---*/

.formtext{
	margin-top:20px;
	text-align:left;
}

.formtext #mail_form{
	margin:20px auto 0;}
	
footer{
	margin-bottom:50px;}

	
.footerInner{
	display:block;
	padding:1px 5% 20px;}
	
.footerInner .footLeft{
	width:100%;
	margin-right:0;
	display:block;}

.footerInner .footLeft .footMenu,	
.footerInner .footRight{
	width:100%;
	margin-top:20px;}
	
.footerInner .footMenu ul li.biglist,
.footerInner .footRight .footMenu .footer_timetable{
	font-size:16px;}

.footerInner .footMenu ul li.biglist_{
	margin-top:0;
}
.footerInner .footMenu ul li{
	font-size:15px;}

.foot_logo{
	padding:5px 5%;}
	
.foot_logo ul{
	display:block;
	padding:10px 0 0;}

.foot_logo ul li{
	width:100%;
	margin-bottom:10px;}

.foot_logo ul li img{
	margin:5px auto 20px;}
}

@media only screen and (max-width:670px) {
#sp_bottom .b_info .b_tel a .sp_bottomTel{
	font-size: 20px;
	margin-top: 5px;
}
#sp_bottom .b_info .b_tel a .sp_bottomTel:before {
	width: 20px;
	height: 25px;
}
}
@media only screen and (max-width:580px) {
#sp_bottom .b_info .b_tel a{
	width:90%;}
#sp_bottom .b_info .b_tel a .sp_bottomTel{
	font-size: 18px;
	margin-top: 10px;
}
}
@media only screen and (max-width:480px) {
#sp_bottom .b_info .b_tel a .sp_bottomTel{
	font-size: 16px;
}
}

@media only screen and (max-width:480px) {

body{
	font-size:15px;}

header#header{
	position:relative;}
	
header .headerInner{
	width: 80%;
}
	

#nav-open {
	right:5%;
}
	
.middle_info ul{
	float:none;
	width:100%;}
	
.middle_info .c_form{
	float:none;
	width:70%;
	margin:10px auto 0;}
	
.headline:after{ width: 100%;}

.case_bg_white,
.case_bg_colored,
.case_bg_gray,
.case_bg_img{ padding:20px 5%;}

#sp_bottom .b_info .b_form img {
    max-height: auto;
    height: auto;
    width: 90%;
	}
}

/* 追加_インタビュー */
.story{
	margin-bottom: 90px;
}
h3.story_q{
	margin-top: 30px;
	color: #555;
}
.story_q:before{
	content: "";
	display: inline-block;
	width: 15px;
	height: 2px;
	background: #333;
	margin-right: 10px;
}
.story_content{
	display: flex;
	justify-content:flex-start;
	width: 100%;
	margin: 60px auto 0;
}
.story_a{
	width: 100px;
}
.story_a_small{
	width: 100px;
}
.story_box{
	width: 90%;
}
.list .link{
	margin-left: auto;
	margin-right: auto;
}
.list .link a .view{
	border:1px solid #ED0707;
}
.story_link .link a:hover{
	text-decoration: none;
}
@media only screen and (max-width: 767px){
.story {
    margin-bottom: 40px;
}
h3.story_q{
	margin-top: 20px;
}
.story_content{
	display: block;
	margin: 20px auto 0;
}	
.story_a,
.story_a_small{
    width: 100%;
	margin-bottom: 10px;
}
.story_box{
    width: 100%;
}
}

/* 追加_セミナーバナー */
.topics_bn{
	text-align: center;
	margin: 0 auto;
	width: 80%;
}
.topics_bn a:hover img{
	opacity: 0.8;
}
@media only screen and (max-width: 767px){
.topics_bn{
	width: 100%;
}
}
video{
	width: 100%;
	height: 600px;
	margin: 0 auto;
}

#cdp2024_link a .view{
	height:auto;
	padding: 8px;
	border-radius: 30px;
	box-sizing: border-box;
	line-height: 1.1rem;
}

/* 追加_採用 */
.recruit{
	background-color:rgba(237,7,7,0.04);
	padding: 10px 5% 30px;
	margin-top: 30px;
}
.recruit_box{
	background-color:#FFF;
	padding: 30px 5%;
	margin-top: 30px;
}
.recruit h4{
	margin: 0 0 20px;
    font-size: 110%;
    color: #333;
	position: relative;
	padding-left: 16px;
}
.recruit h4:before{
    position: absolute;
    top: 10px;
    left: 0;
    width: 6px;
    height: 6px;
    content: '';
    background: #ED0707;
	margin: auto auto auto 0;
}