@charset "utf-8";
/*--------------------------------------------------------------------
   base
---------------------------------------------------------------------*/
body {
    animation: fadeIn 2s ease 0s 1 normal;
    -webkit-animation: fadeIn 2s ease 0s 1 normal;
}

@keyframes fadeIn {
    0% {opacity: 0}
    100% {opacity: 1}
}

@-webkit-keyframes fadeIn {
    0% {opacity: 0}
    100% {opacity: 1}
}


html, body{height: 100%;}
body{
	background-color: #fff;
	text-align:center;
	color:#222222;
	font-size:16px;
    font-family:"Lato","游ゴシック体", YuGothic, "游ゴシック", "Yu Gothic", "メイリオ", sans-serif;
    font-weight:400;
}

input{
    font-family:"Lato","游ゴシック体", YuGothic, "游ゴシック", "Yu Gothic", "メイリオ", sans-serif;
    font-weight:400;
}

@media all and (-ms-high-contrast:none) {
	body {
		font-family: "Lato","メイリオ",Meiryo,"游ゴシック",YuGothic,"ヒラギノ角ゴ Pro W3","Hiragino Kaku Gothic Pro","ＭＳ Ｐゴシック","MS PGothic",sans-serif;
	}
}

a{
	text-decoration: none;
  transition: all 0.5s;
}
a:link{ 
	color:#222;
    text-decoration:none;
    
    }
a:visited{color:#222;}
a:active{color:#222;}
a:hover{color:#333; }

strong{font-weight:bold;}
img{font-size:0; line-height:0;}


/*--------------------------------------------------------------------
   header
---------------------------------------------------------------------*/
header{
    width:100%;
    margin:0 auto;
    height:80px;
}
#hdrIn{ 
	width: 1300px;
    height:80px;
	position:relative;
}
header h1,
header .logo{
    width:186px;
    height:33px;
    overflow:hidden;
	position: absolute;
	top: 0;
	right: 0;
	bottom: 0;
	left: 0;
	margin: auto auto auto 50px;
}
header h1 a,
header .logo a{
    display:block;
    background:url(../images/logo.svg) 50% 50% no-repeat;
    background-size:contain;
    width:100%;
    height:100%;
    overflow:hidden;
    white-space:nowrap;
    text-indent:101%;
    line-height:0;
    font-size:0.1em;
}

header nav{
    margin-left:200px;
}

header nav ul{
    overflow:hidden;
    text-align:right;
    padding-top:20px;
}
header nav li{
    display:inline-block;
    height:40px;
    margin-left:2em;
}
header nav li a{
    display:block;
    height:40px;
    line-height:40px;
	font-size: 0.875em;
    color:#fff !important;
    overflow:hidden;
    position:relative;
}
header nav li a span{
    content:"";
    display:block;
    width:100%;
    height:1px;
    background-color:#fff;
    position:absolute;
    bottom:0;
    left:0;
    margin-left:-100%;
}

#spmenu{display:none;}
#menubtn{display:none;}

#humberger,
#drawernav,
#overlay{display:none;}


/* scrolling
-----------------------*/
.clone-hdr {
  position: fixed;
  top: 0;
  left: 0;
  z-index: 900;
  width: 100%;
  transition: .3s;
  transform: translateY(-100%);
}
.is-show {
  transform: translateY(0);
}

header.clone-hdr{background-color:rgba(255,255,255,0.85);}
header.clone-hdr h1 a,
header.clone-hdr .logo a{
	background:url(../images/logo2.svg) 50% 50% no-repeat;
    background-size:contain;
}
header.clone-hdr nav li a{color:#222 !important;}
header.clone-hdr nav li a span{background-color:#222;}

/*--------------------------------------------------------------------
   footer
---------------------------------------------------------------------*/
#ftrBnr{ padding: 40px 0;}
#ftrBnr ul{ 
	width: 912px;
	padding: 0;
	overflow: hidden; 
}/*
#ftrBnr ul li{
	width: 45%;
	float: left;
	padding: 0 8px;
}*/

#ftrBnr ul{text-align: center;}
#ftrBnr ul li{display: inline-block; width: 33.333%; padding: 0 8px;}

#ftrContact{
	background-color: #d6d7e2;
	padding: 50px 0;
}
#ftrContact .wrapBox{width: 940px;}
#ftrContact .wrapBox .titBox{
	width: 25%;
	float: left;
}
#ftrContact .wrapBox ul{
	width: 75%;
	float: right;
}
#ftrContact .wrapBox ul li{
	width: 50%;
	float: left;
	text-align: center;
}
#ftrContact .wrapBox ul li.ftrForm{padding-right: 7.3%;}

#ftrContact .wrapBox .titBox{
	padding-top: 20px;
	font-size: 0.813em;
	text-align: center;
	font-weight: bold;
	color: #1c2b77;
}
#ftrContact .wrapBox .titBox span{
	display: block;
	padding-bottom: 10px;
	font-size: 1.692em;
}
#ftrContact .wrapBox ul li .tit{
	font-weight: bold;
	font-size: 0.875em;
	display: block;
	padding-bottom: 15px;
}
#ftrContact .wrapBox ul li.ftrTel a{
	display: block;
	text-align: center;
	font-size: 1.750em;
}
#ftrContact .wrapBox ul li.ftrTel a span{
	font-size: 0.714em;
	font-weight: 700;
}

#ftrContact .wrapBox ul li.ftrTel p{
	padding-top: 10px;
	font-size: 0.875em;
}
#ftrContact .wrapBox ul li.ftrTel p span{ font-size: 0.929em;}

#ftrContact .wrapBox ul li.ftrForm a{
	display: block;
	width: 250px;
	height: 46px;
	max-width: 100%;
	margin: 5px auto;
	border-radius: 23px;
	background-color: #1c2b77;
	text-align: center;
	line-height: 46px;
	font-size: 0.813em;
	color: #fff;
}
#ftrContact .wrapBox ul li.ftrForm a:hover{ background-color: #1b34b0;}

footer nav{background-color: #232527; padding: 30px 0;}
footer nav ul{text-align:center;}
footer nav ul li{
    display:inline-block;
    margin:0 1.5em;
	font-size: 0.875em;
}
footer nav ul li a,
footer nav ul li a:link,
footer nav ul li a:active,
footer nav ul li a:visited{color: #fff;}
footer nav ul li a:hover{color: #ccc;}

footer nav ul.en{text-align: right;}

#ftrBtm {padding: 25px 0;}
#ftrBtm .mark{
	width: 30%;
	float: left;
	text-align: left;
}
#ftrBtm .mark a{
	display: inline-block;
}
#ftrBtm .mark a img{
	height: 65px;
	width: auto;
}
#ftrBtm .mark a img + img,
#ftrBtm .mark a + a{margin-left: 15px;}

#ftrBtm .ftrLink{
	width: 70%;
	float: right;
	text-align: right;
}
#ftrBtm .ftrLink ul{
	padding: 10px 0;
	text-align: right;
}
#ftrBtm .ftrLink ul li{
	display: inline-block;
	font-size: 0.750em;
	margin-left: 1.6em;
	line-height: 2.25;
}
footer .copy{
    font-size:0.750em;
	color: #999;
}
footer .copy a{ color: #999 !important;}

/*--------------------------------------------------------------------
   maintitle
---------------------------------------------------------------------*/
#mainTitle{
    max-width:100%;
    background-position:center center;
    background-repeat:no-repeat;
    background-size:cover;
    position:relative;
    top:-80px;
    z-index:-1;    
}
#mainTitle.service{ background-image:url("../images/bg_maintitle_service.jpg");}
#mainTitle.company{ background-image:url("../images/bg_maintitle_company.jpg");}
#mainTitle.message{ background-image:url("../images/bg_maintitle_company.jpg");}
#mainTitle.philosophy{ background-image:url("../images/bg_maintitle_philosophy.jpg");}
#mainTitle.recruit{ background-image:url("../images/bg_maintitle_recruit.jpg");}
#mainTitle.office365{ background-image:url("../images/bg_maintitle_microsoft365.jpg");}
#mainTitle.english{ background-image:url("../images/bg_maintitle_english.jpg");}
#mainTitle.contact{ background-image:url("../images/bg_maintitle_contact.jpg");}
#mainTitle.information{ background-image:url("../images/bg_maintitle_information.jpg");}
#mainTitle.commonPage{ background-image:url("../images/bg_maintitle_common.jpg");}
#mainTitle.dx_strategy{ background-image:url("../images/bg_maintitle_service.jpg");}

#mainTitle .inner{
    width:100%;
    padding-top:440px;
    margin:0 auto;
    overflow:hidden;
    position:relative;
}

@media screen and (max-width: 1079px) {
    #mainTitle .inner{padding-top:40%;}
}

#mainTitle h1{
    height:4.5em;
    font-size:1.125em;
	font-weight: bold;
    color:#fff;
    position:absolute;
    top:0;
    left:0;
    right:0;
    bottom:0;
    margin:auto;
}
#mainTitle h1 span{
	display: block;
	padding-bottom: 10px;
	font-size: 2.667em;
}
#mainTitle.commonPage h1,
#mainTitle.english h1{
	height: 1em;
	font-size: 2.250em;
}


/*--------------------------------------------------------------------
   container
---------------------------------------------------------------------*/
#container{
    margin-top:-80px;
    padding:0;
}
/* base
-----------------------*/
div[id="container"] p,
div[id="container"] span,
div[id="container"] div,
div[id="container"] li,
div[id="container"] dt,
div[id="container"] dd,
div[id="container"] th,
div[id="container"] td{
    line-height:1.875;
    text-align:left; }

div[id="container"] p + p,
div[id="container"] p + ul,
div[id="container"] p + ol,
div[id="container"] p + dl,
div[id="container"] p + table,
div[id="container"] p + div,
div[id="container"] ul + p,
div[id="container"] ul + ul,
div[id="container"] ul + ol,
div[id="container"] ul + dl,
div[id="container"] ul + table,
div[id="container"] ul + div,
div[id="container"] ol + p,
div[id="container"] ol + ul,
div[id="container"] ol + ol,
div[id="container"] ol + dl,
div[id="container"] ol + table,
div[id="container"] ol + div,
div[id="container"] dl + p,
div[id="container"] dl + ul,
div[id="container"] dl + ol,
div[id="container"] dl + dl,
div[id="container"] dl + table,
div[id="container"] dl + div,
div[id="container"] table + p,
div[id="container"] table + ul,
div[id="container"] table + ol,
div[id="container"] table + dl,
div[id="container"] table + table,
div[id="container"] table + div,
div[id="container"] div + p,
div[id="container"] div + ul,
div[id="container"] div + ol,
div[id="container"] div + dl,
div[id="container"] div + table{margin-top:20px;}

div[id="container"] h3,
div[id="container"] h4,
div[id="container"] h5{line-height:1.5;}

div[id="container"].second * + h3,
div[id="container"].second * + h4,
div[id="container"].second * + h5{margin-top:30px;}


/*----------------------------------------------------
local --- top
-------------------------------------------------------*/
/* mainimage
---------------------------------------------------------*/
#mainImage{
    max-width:100%;
    position:relative;
    top:-80px;
    z-index:-1;
	}
#mainImage li .inner{
    width:100%;
	padding-top: 830px;
    margin:0 auto;
    overflow:hidden;
    position:relative;
}

#mainImage li #main01{background:url(../images/main01.jpg) center center no-repeat;background-size:cover;}
#mainImage li #main02{background:url(../images/main02.jpg) center center no-repeat;background-size:cover;}

#mainImage .bx-prev,
#mainImage .bx-next{ display:none;}

@media screen and (max-width: 1079px) {
	#mainImage li .inner{padding-top: 76.85%;}
}

#mainImage li .inner p{
	width: 100%;
	text-align: center;
	color: #fff;
	font-weight: bold;
	position: absolute;
	left: 0;
}

#mainImage li #main01 p{
	font-size: 1.375em;
	top: 38.5%;
}
#mainImage li #main01 p span{
	display: block;
	padding-bottom: 20px;
	font-size: 3.227em;
}

#mainImage li #main02 p{
	font-size: 2em;
	top: 27%;
}
#mainImage li #main02 p img{
	display: block;
	width: 300px;
	height: auto;
	margin: 0 auto 40px;
}
#mainImage li #main02 p span{
	display: inline-block;
	margin-top: 20px;
	padding: 0 45px;
	font-size: 0.750em;
	font-weight: bold;
	position: relative;
}
#mainImage li #main02 p span::before,
#mainImage li #main02 p span::after{
	content: "";
	width: 25px;
	height: 1px;
	background-color: #fff;
	position:absolute;
	top: 0.5em;
}
#mainImage li #main02 p span::before{left: 0;}
#mainImage li #main02 p span::after{right: 0;}

/* topInfo
---------------------------------------------------------*/
#topInfo{
	background-color: #f7f7f7;
	padding: 50px 0 55px;	
}
#topInfo .tit{
	width: 235px;
	float: left;
}
#topInfo .tit h2{
	text-align: center;
	font-weight: bold;
	font-size: 	0.875em;
	color: #1c2b77;
	margin-bottom: 20px;
}
#topInfo .tit h2 span{
	display: block;
	padding-bottom: 5px;
	font-size: 1.286em;
	line-height: 1;
	text-align: center;
}
#topInfo .tit a{
	display: block;
	width: 138px;
	height: 32px;
	margin: 0 auto;
	border-radius: 16px;
	background-color: #1c2b77;
	text-align: center;
	line-height: 32px;
	color: #fff;
	font-size:0.750em;
}

#topInfo .tit a:hover{background-color:#1b34b0;}
#topInfo .list > a{display: none;}
#topInfo .list{margin-left: 250px;}
#topInfo .list ul li + li{margin-top: 15px;}
#topInfo .list ul li p a:hover{text-decoration: underline;}
#topInfo .list ul li{overflow: hidden;}
#topInfo .list ul li span{
	display: block;
	width: 5em;
	float: left;
	color: #999999;
	font-size: 0.750em;
	line-height: 25px;
}
#topInfo .list ul li p{
	margin-left: 6.5em;
	line-height: 1.78;
}
/* topAbout
---------------------------------------------------------*/
#topAbout{
	position: relative;
}
#container #topAbout::after{
	content: "";
	visibility: visible;
	display: block;
	height:auto;
	padding-right: 43.8%;
	background: url("../images/img_top_about.jpg") center center no-repeat;
	background-size: cover;
	position: absolute;
	top: 0;
	right: 0;
	bottom: 0;
}
#topAbout .inner{
	width: 50%;
	min-height: 610px;
	margin-right: auto;
	padding: 70px 0 30px;
	text-align: center;
}
#topAbout .inner h2,
#topService h2,
#topLink a h2{
	color: #1c2b77;
	text-align: center;
	font-size: 	0.875em;
	font-weight: bold;
	margin-bottom: 40px;
}
#topAbout .inner h2 span,
#topService h2 span,
#topLink a h2 span{
	display:block;
	padding-bottom: 5px;
	font-size: 1.857em;
	line-height: 1;
	text-align: center;
}
#topAbout h3{
	margin-bottom: 20px;
}
#topAbout h3 span{
	text-align: center;
	font-weight: bold;
	font-size: 1.375em;	
}
#topAbout h3 + p{
	text-align: center;
	margin-bottom: 20px;
}

#topAbout ul{
	display: inline-block;
	text-align: left;
	margin-bottom: 20px;
}
#topAbout ul li + li{margin-top: 15px;}
#topAbout ul li{
	background: url( "../images/ico_check.svg") 0 10px no-repeat;
	background-size: 17px auto;
	padding-left: 25px;
}
#topAbout ul + p{text-align: center;}

/* topService
---------------------------------------------------------*/
#topService{
	background: url("../images/img_top_service.jpg") center center no-repeat;
	background-size: cover;
	padding: 60px 0 80px;
	text-align: center;
}

#topService h2{
	color: #fff;
	margin-bottom: 40px;
}
#topService ul{
	overflow: hidden;
	padding-left: 40px;
	padding-right: 40px;
	margin-bottom: 60px;
}
#topService ul li{
	width: 16.6666%;
	float: left;
	padding: 0 8px;
}
#topService ul li div{
	border:#fff 1px solid;
	width: 100%;
	padding-top: 100%;
	border-radius: 50%;
	position: relative;
}
#topService ul li div span{
	display: block;
	width: 100%;
	height: 3.5em;
	text-align: center;
	color: #fff;
	font-weight: bold;
	font-size: 0.813em;
	line-height: 1.6;
	position: absolute;
	top: 0;
	left: 0;
	right: 0;
	bottom: 0;
	margin: auto;
}
#topService ul li:nth-child(5) div span,
#topService ul li:nth-child(6) div span{
	height: 1.6em;
}

#topService a{
	display: block;
	width: 250px;
	height: 50px;
	margin: 0 auto;
	border-radius: 25px;
	background-color: #fff;
	text-align: center;
	line-height: 50px;
	color: #1c2b77;
	font-size:	0.875em;
	font-weight: bold;
}

#topService a:hover{background-color:#1c2b77; color: #fff;}

/* topLink
---------------------------------------------------------*/
#topLink{
	background-color: #f6f6f6;
	padding: 60px 0;
}
#topLink a{
	display: block;
	width: 48%;
	float: left;
	padding-top: 27.14%;
	position: relative;
}
#topLink a + a{float: right;}
#topLink a span.img{
	display: block;
	width: calc(100% - 30px);
	height: 100%;
	background-position: center center;
	background-repeat: no-repeat;
	background-size: cover;
	position:absolute;
	top: 0;
	right: 0;
	z-index: 90;
}
#topLink a:nth-child(1) span.img{background-image: url("../images/img_top_company_ov.jpg");}
#topLink a:nth-child(2) span.img{background-image: url("../images/img_top_recruit_ov.jpg");}

#topLink a span.img::before{
	content: "";
	display: block;
	width: 100%;
	height: 100%;
	background-position: center center;
	background-repeat: no-repeat;
	background-size: cover;
	position:absolute;
	top: 0;
	right: 0;
 	transition: all 0.5s;
}

#topLink a:nth-child(1) span.img::before{background-image: url("../images/img_top_company.jpg");}
#topLink a:nth-child(2) span.img::before{background-image: url("../images/img_top_recruit.jpg");}

#topLink a:hover span.img::before{opacity: 0;}

#topLink a h2{
	text-align: left;
	position: absolute;
	left: 0;
	top: 25%;
	z-index: 100;
}

/*----------------------------------------------------
local --- second
-------------------------------------------------------*/
div[id="container"].second p a{text-decoration: underline;}
div[id="container"].second p a:hover{text-decoration:none;}
/* service
----------------------------------------------------*/
#container.service section{
	width: 100%;
	padding: 60px 0;
}

#container.service section.even{background-color:#f6f6f6;}

#container.service section.lNav{
	background-color: #d6d7e2;
	padding: 40px 0 20px;	
}

#container.service section.lNav ul{overflow: hidden;}
#container.service section.lNav ul li{
	width: 32%;
	float: left;
	margin-right: 2%;
	padding-bottom: 20px;
}
#container.service section.lNav ul li.nth03{margin-right: 0;}
#container.service section.lNav ul li a{
	display:block;
	width: 100%;
	height: 44px;
	border-radius: 22px;
	background-color: #eeeff8;
	color: #1c2b77;
	font-weight: bold;
	font-size: 0.875em;
	line-height: 44px;
	white-space: nowrap;
	text-align: center;
	position: relative;
}
#container.service section.lNav ul li a::after{
	content: "";
	display: block;
	width: 10px;
	height: 8px;
	background-position: 0 0;
	background-repeat: no-repeat;
	background-size: contain;
	background-image: url("../images/ico_arrow_b.svg");
	position: absolute;
	top: 50%;
	right: 16px;
	margin-top: -4px;
}

#container.service section.lNav ul li a:hover{
	color: #fff;
	background-color: #1c2b77;
}
#container.service section.lNav ul li a:hover::after{background-image: url("../images/ico_arrow_w.svg");}

#container.service section h2{
	color: #1c2b77;
	font-weight: bold;
	font-size: 	1.500em;
	margin-bottom: 20px;	
}
#container.service section ul.ico li{
	background: url("../images/ico_check.svg") 0 10px no-repeat;
	background-size:19px auto;
	padding-left: 26px;
}
#container.service section ul.ico li + li{margin-top: 5px;}

#container.service section ul.ico li span{
	display: block;
	font-weight: bold;
}
#container.service section ul.ico li p{
	margin-left: -26px;
	padding-bottom: 10px;
}

#container.service section ul.att li{
	font-size: 	0.875em;
	padding-left: 1.2em;
	position: relative;	
}
#container.service section ul.att li span{
	position: absolute;
	top: 0;
	left: 0;
}
/* company
----------------------------------------------------*/
#container.company,
#container.message,
#container.recruit,
#container.office365,
#container.commonPage,
#container.information,
#container.contact{
	padding-top: 70px;
	border-bottom: #e2e2e2 1px solid;
}
#container.company section{
	width: 940px;
	padding-bottom: 80px;
}
#container.company section h2,
#container.recruit section h2{
	text-align: center;
	font-size: 1.875em;
	font-weight: bold;
	margin-bottom: 40px;
}
#container.company section table,
#container.recruit section table,
#container.commonPage section.tbBox table,
#container.english section table{
	width: 100%;
	border-top: #e2e2e2 1px solid;
	table-layout: fixed;
}
#container.company section table th,
#container.company section table td,
#container.recruit section table th,
#container.recruit section table td,
#container.commonPage section.tbBox table th,
#container.commonPage section.tbBox table td,
#container.english section table th,
#container.english section table td{
	border-bottom: #e2e2e2 1px solid;
	padding: 20px 10px;
	text-align: left;
}
#container.company section table th,
#container.recruit section table th,
#container.commonPage section.tbBox table th,
#container.english section th{font-weight: bold;}

#container.company section#outline table th{width: 22.5%;}
#container.company section#history table th{width: 240px;}
#container.recruit table th{ width: 22%;}
#container.english section th{ width: 30%;}
#container.commonPage section.tbBox table th{ width: 25%;}

#outline td dl.place,
#outline td dl.officer{overflow: hidden;}
#outline td dl.place dt,
#outline td dl.officer dt{
	float: left;
	cler:left;
}
#outline td dl.place dt{width: 7em;}
#outline td dl.place dd{ margin-left: 7em;}
#outline td dl.officer dt{width: 6em;}
#outline td dl.officer dd{ margin-left: 6em;}

#outline td dl.officer dd a{ color: #1c2b77; text-decoration: underline; margin-left: 1em;}
#outline td dl.officer dd a:hover{text-decoration: none;}

#access p + .mapBox{margin-top: 40px;}
#access .mapBox{
	padding-top: 53.57%;
	position: relative;	
}
#access .mapBox iframe{
	width: 100%;
	height: 100%;
	position: absolute;
	top: 0;
	left: 0;
}

/*message----------------*/
#container.message section{
	width: 940px;
	padding-bottom: 70px;
}
#container.message h2{
	text-align: center;
	font-weight: bold;
	font-size: 1.875em;
	margin-bottom: 40px;
}
#container.message h3{
	margin-bottom: 30px;
	text-align: center;
}
#container.message h3 span{
	font-weight: bold;
	font-size: 1.125em;
	line-height: 3;
}
#container.message p + p{margin-top: 50px;}
#container.message p {line-height: 2.125;}

/* philosophy
----------------------------------------------------*/
#philosophy01{
	padding-top: 70px;
	padding-bottom: 60px;
}
#philosophy01 h2{
	text-align: center;
	margin-bottom: 20px;
}
#philosophy01 h2 span{
	font-weight: bold;
	font-size:1.563em;
	line-height: 1.76;
}
#philosophy01 p{
	text-align: center;
}
#philosophy01 p span{
	font-weight: bold;
	font-size:	1.125em;
	line-height: 1.88;
}

#container.philosophy section#philosophy02{
	background-color: #f6f6f6;
	width: 100%;
	padding: 60px 0 20px;
}

#philosophy02 .wrapBox{
	width: 1020px;
	padding-left: 30px;
	padding-right: 30px;
}

#philosophy02 .wrapBox .inner{
	width: 50%;
	float: left;
	padding: 0 40px 40px;	
}
#philosophy02 .wrapBox .inner h3{
	font-weight:bold;
	font-size: 	1.250em;
	color: #1c2b77;
	margin-bottom: 10px;
}
#philosophy02 .wrapBox .inner p{line-height: 2;}




/* recruit
----------------------------------------------------*/
#container.recruit section{
	width: 920px;
	padding-bottom: 80px;
}
#container.recruit h3{
	color: #1c2b77;
	font-weight: bold;
	font-size: 	1.250em;
	text-align: left;
	margin-bottom: 15px;
}
#container.recruit p.bnr a img{
	border: #dbdbdb 1px solid;
	width: 285px;
	height: auto;
}

#container.recruit section table td li + li{
	border-top: #e2e2e2 1px solid;
	margin-top: 20px;
	padding-top: 20px;
}

#container.recruit section table td ul.noBd li + li{
	border: none;
	padding-top: 0;
	margin-top: 0;
}


/* office365
----------------------------------------------------*/
#container.office365 section{padding-bottom: 80px;}

#container.office365 section h2{
	text-align: center;
	font-weight: bold;
	font-size: 1.875em;
	margin-bottom: 30px;
}

#container.office365 section.lead h2 span{
	display: block;
	font-weight: bold;
	text-align: center;
        color: #ea3c01;
}
#container.office365 section.lead h2 img{
	display: block;
	width: 274px;
	height: 61px;
	max-width: 80%;
	margin: 0 auto 10px;
}
#container.office365 section.lead p{
	text-align: center;
	font-size: 	1.250em	;
	line-height: 1.8;
}

#container.office365 section h3{
	padding: 10px 12px;
	background-color: #eed0c6;
	text-align: left;
	font-weight: bold;
	font-size: 	1.063em;
	margin-bottom: 20px;	
}
#container.office365 section h4{
	text-align: left;
	font-weight: bold;
}
#container.office365 section h4 + p{
	padding-left: 1em;
}
#container.office365 section .bnrArea{
	padding-top: 30px;
	width: 468px;
	max-width: 100%;
	margin: 0 auto;
}
#container.office365 section .leadTxt{text-align: center;}

#container.office365 section .flow{
	width: 796px;
	max-width: 100%;
	margin: 0 auto;
	padding: 40px 0 110px;
	text-align: center;}
#container.office365 section .flow img{
	width: 100%;
	height: auto;
}
#container.office365 section .bdBox{
	border: #ec3b00 1px solid;
	padding: 60px 15px;
	position: relative;
}
#container.office365 section .bdBox h3{
	width: 400px;
	height: 40px;
	max-width: 100%;
	background-color: #fff;
	text-align: center;
	font-weight: bold;
	line-height:1;
	font-size:1.750em;
	color: #ec3b00 ;
	position: absolute;
	left: 0;
	right: 0;
	top: -20px;
	margin: 0 auto;
}

#container.office365 section .bdBox > p{
	text-align: center;
	padding-bottom: 30px;
}

#container.office365 section .bdBox ul{
	width: 600px;
	max-width: 100%;
	margin: 0 auto;
	overflow: hidden;
}
#container.office365 section .bdBox ul li{
	width: 50%;
	float: left;
	text-align: center;
	padding-left: 15px;
	padding-right: 15px;
}
#container.office365 section .bdBox ul li .tit{
	font-weight: bold;
	font-size: 0.875em;
	text-align: center;
	display: block;
	padding-bottom: 15px;
}
#container.office365 section .bdBox ul li.ftrTel a{
	display: block;
	text-align: center;
	font-size: 1.750em;
	color: #e83c06;
}
#container.office365 section .bdBox ul li.ftrTel a span{
	font-size: 0.714em;
	font-weight: 700;
}

#container.office365 section .bdBox ul li.ftrTel p{
	margin-top: -5px;
	text-align: center;
	font-size: 0.875em;
}
#container.office365 section .bdBox ul li.ftrTel p span{ font-size: 0.929em;}

#container.office365 section .bdBox ul li.ftrForm a{
	display: block;
	width: 260px;
	height: 48px;
	max-width: 100%;
	margin: 5px auto;
	border-radius: 24px;
	background-color: #e83c06;
	text-align: center;
	line-height: 48px;
	font-size: 0.813em;
	color: #fff;
}
#container.office365 section .bdBox ul li.ftrForm a:hover{ background-color: #ff4d15;}

/* commonPage
----------------------------------------------------*/
#container.commonPage section{
	padding-bottom: 50px;
}
#container.commonPage section h2{
	font-size:	1.063em;
	font-weight: bold;
	text-align: left;
	margin-bottom: 20px;
}
#container.commonPage section * + h2{margin-top: 30px;}

.listSecurity li{
	position: relative;
	padding-left: 1em;
}
.listSecurity li::before{
	position: absolute;
	top: 0;
	left: 0;
}
.listSecurity > li::before{content: "■";}
.listSecurity > li li::before{content: "・"; font-weight: bold;}
.listSecurity > li ul{margin-left: -1em;}

#container.commonPage section.tbBox{width:940px;}

#container.commonPage section.tbBox table td ul li{
	position: relative;
	padding-left: 1em;
}
#container.commonPage section.tbBox table td ul li + li{margin-top: 15px;}
#container.commonPage section.tbBox table td ul li::before{
	content: "・"; 
	font-weight: bold;
	position: absolute;
	top: 0;
	left: 0;
}
#container.commonPage section .markImg{
	width: 150px;
	margin: 30px auto 0;
	white-space: nowrap;
}
.markImg img{
	height: 90px;
	width: auto;
}

/* english
----------------------------------------------------*/
#container.english{
	padding:80px 0;
}
#container.english section{
	width: 940px;
}
#container.english section h2{
	text-align: center;
	font-weight: 700;
	font-size: 1.875em;
	margin-bottom: 30px;
}

/* dx_strategy
----------------------------------------------------*/
#container.dx_strategy section{
	width: 100%;
	padding: 60px 0;
}

#container.dx_strategy section.even{background-color:#f6f6f6;}

#container.dx_strategy section#overview01{
	padding-top: 70px;
	padding-bottom: 60px;
}
#container.dx_strategy section#overview01 h2{
	text-align: center;
}
#container.dx_strategy section#overview01 h2 span{
	font-weight: bold;
	font-size:1em;
	line-height: 1.76;
}
#container.dx_strategy section#overview01 p{
	text-align: center;
}
#container.dx_strategy section#overview01 p span{
	font-weight: bold;
	font-size:	1.125em;
	line-height: 1.88;
}

#container.dx_strategy section#overview02{
	background-color: #f6f6f6;
	width: 100%;
	padding: 60px 0 20px;
}

#container.dx_strategy section#overview02 .wrapBox{
	width: 1020px;
	padding-left: 30px;
	padding-right: 30px;
}

#container.dx_strategy section#overview02 .wrapBox .inner{
	width: 50%;
	float: left;
	padding: 0 20px 40px;	
}
#container.dx_strategy section#overview02 .wrapBox .inner h3{
	font-weight:bold;
	font-size: 	1.250em;
	color: #1c2b77;
	margin-bottom: 10px;
}
#container.dx_strategy section#overview02 .wrapBox .inner p{line-height: 2;}

#container.dx_strategy section.lNav{
	background-color: #d6d7e2;
	padding: 40px 20px;
}

#container.dx_strategy section.lNav ul{overflow: hidden;}
#container.dx_strategy section.lNav ul li{
	width: 20%;
	display: inline-block;
	margin-right: 2%;
}
#container.dx_strategy section.lNav ul li.nth03{margin-right: 0;}
#container.dx_strategy section.lNav ul li a{
	display:block;
	width: 100%;
	height: 44px;
	border-radius: 22px;
	background-color: #eeeff8;
	color: #1c2b77;
	font-weight: bold;
	font-size: 0.875em;
	line-height: 44px;
	white-space: nowrap;
	text-align: center;
	position: relative;
}
#container.dx_strategy section.lNav ul li a::after{
	content: "";
	display: block;
	width: 10px;
	height: 8px;
	background-position: 0 0;
	background-repeat: no-repeat;
	background-size: contain;
	background-image: url("../images/ico_arrow_b.svg");
	position: absolute;
	top: 50%;
	right: 16px;
	margin-top: -4px;
}

#container.dx_strategy section.lNav ul li a:hover{
	color: #fff;
	background-color: #1c2b77;
}
#container.dx_strategy section.lNav ul li a:hover::after{background-image: url("../images/ico_arrow_w.svg");}

#container.dx_strategy section h2{
	color: #1c2b77;
	font-weight: bold;
	font-size: 	1.500em;
	margin-bottom: 20px;	
}

#container.dx_strategy section h2 span.text{
	color: #000000;
	font-weight: bold;
	margin-bottom: 20px;	
}

#container.dx_strategy section ul.ico li{
	background: url("../images/ico_check.svg") 0 10px no-repeat;
	background-size:19px auto;
	padding-left: 26px;
}
#container.dx_strategy section ul.ico li + li{margin-top: 5px;}

#container.dx_strategy section ul.ico li span{
	display: block;
	font-weight: bold;
}
#container.dx_strategy section ul.ico li p{
	margin-left: -26px;
	padding-bottom: 10px;
}

#container.dx_strategy section ul.att li{
	font-size: 	0.875em;
	padding-left: 1.2em;
	position: relative;	
}
#container.dx_strategy section ul.att li span{
	position: absolute;
	top: 0;
	left: 0;
}

#container.dx_strategy section hr{
	margin: 0 0 10px 0;
	border-width: 3px; /* 線の太さを指定 */
	border-color: cadetblue; /*線の色を指定 */
}

/* blog
----------------------------------------------------*/
/*layout*/
#container .blogIndex,
#container .blogDetail{
	width: 920px;
    overflow:hidden;
	text-align:left;
	padding-bottom: 80px;
    }

/* newsList
-----------------------*/
#container .blogIndex .newsList{ border-top:#e2e2e2 1px solid;}
#container .blogIndex .newsList li{
	position:relative;
     border-bottom:#e2e2e2 1px solid;
     padding:20px 0;
}
#container .blogIndex .newsList li span.date{
	font-size:	0.875em;
	line-height: 30px;
	color: #676767;
    position:absolute;
    top:20px;
    left:0;
}

#container .blogIndex .newsList li p{
    margin-left:100px;
	font-size: 1.125em;
	line-height: 30px;
}
#container .blogIndex .newsList li p a{
    color:#222;
    text-decoration:none;
}


/*detailTitle*/

.blogTitle{
    border-bottom:#e2e2e2 1px solid;
    padding-bottom:10px;
    margin-bottom:20px;
    text-align:left;    
}
#container .blogTitle h2{
    margin-bottom:0;
    font-weight:normal;
    text-align:left;
    font-size:1.500em;
    line-height:1.5; 
}
.blogTitle span{
    display:inline-block;
	font-size:	0.875em;
	color: #676767;
	position: relative;
}

/*detail*/
.post {padding-bottom:80px;}
.post p,
.post li,
.post td,
.post th,
.post div{font-size: 0.938em; line-height: 2;}

.post >img,
.post p img{
    display:block;
    width:100%;
    max-width:740px;
    margin:30px auto;
}
.post h4,
.post h5,
.post h6{
    font-weight:bold;
    text-align:left;
    margin-bottom:20px;
}
.post * + h4{margin-top:50px; font-size: 1.200em;}
.post * + h5{margin-top:20px; font-size: 1.067em;}
.post * + h6 {margin-top:20px;}
.post * + p,
.post * + ul{margin-top: 15px;}
.post p a{text-decoration:underline;}
.post p a:hover{text-decoration:none;}

.post ul li{position:relative; padding-left:1.5em;}
.post ul li::before{
    content:"・";
    position:absolute;
    top:0;
    left:0;
}

/* pager
--------------*/
.pagination{    
    width:1000px;
    max-width:100%;
    margin:0 auto !important;
    text-align:center;
    padding-top:60px;}
#container .blogIndex .pagination ul{margin-top:0; text-align: center;}
.pagination li{
    display:inline-block;
    margin:0 4px;
}
.pagination li a,
.pagination li span{
    display:block;
    border:#999999 1px solid;
    background-color:#fff;
    width:28px;
    line-height:28px !important;
    font-size:12px;
    text-align:center;
    color:#000 !important;
    text-decoration:none !important;
}
.pagination li a:hover{ color:#333 !important; background-color:#e8e8e8;}
.pagination li span.dots{border:none; width:auto; color:#333; background:none;}
.pagination li span.current{
    background-color:#333 !important;
    color:#fff !important;
}

/* pager2
--------------*/
.pageNav ul{
	width: 414px;
	max-width: 100%;
	margin: 0 auto;
    overflow:hidden;
    position:relative;
}
.pageNav ul li{
	width: 26.5%;
    height:50px;
	float: left;	
}
.pageNav ul li + li{margin-left: 10.2%;}

.pageNav ul li a{
    display:block;
    width:100%;
    height:100%;
    border:#bbbbbb 1px solid;
    position:relative;
    line-height:50px;
    font-size:0.813em;
    color:#222;
    text-decoration:none !important;
}
.pageNav ul li a:hover{background-color:#e8e8e8;}
.pageNav ul li.back a{text-align: center;}
.pageNav ul li.prev a{
    text-align:left;
    padding-left:50px;    
}
.pageNav ul li.next a{
    text-align:right;
    padding-right:50px;    
}
.pageNav ul li.prev a::before,
.pageNav ul li.next a::before{
    display:block;
    width:15px;
    height:8px;
    background-position:0 0;
    background-repeat:no-repeat;
    background-size:contain;
    font-size:12px;
    line-height:1;
    font-family:san-serif;
    margin-top:-0.3em;
    position:absolute;
    top:50%;
}
.pageNav ul li.prev a::before{left:15px; content:"←";}
.pageNav ul li.next a::before{right:15px; content:"→";}


/* contact
----------------------------------------------------*/
#container.contact{padding-bottom: 80px;}

#container.contact section > p.contactLead{
	text-align:center;
	margin-bottom: 30px;
}

#container.contact section h2{
	text-align: center;
	font-weight: bold;
	font-size:	1.125em;
	margin-bottom: 15px;
}
#container.contact section .tel{
	text-align: center;
	padding-bottom: 50px;
}

#container.contact section .tel a{
	display: block;
	text-align: center;
	font-size: 1.875em;
}
#container.contact section .tel a span{
	font-size: 0.733em;
	font-weight: 700;
}

#container.contact section .tel p{
	margin-top: -5px;
	text-align: center;
	font-size: 0.875em;
}
#container.contact section .tel p span{ font-size: 0.929em;}

/* form
----------------------------------------------------*/
#form .require{ font-size:	0.938em;  margin-top: 20px;}
#form .require span{color:#cc3333; font-weight: bold;}

input[type="checkbox"],
input[type="radio"] { 
     vertical-align:middle; 
    font-family: "游ゴシック体", YuGothic, "游ゴシック", "Yu Gothic", "メイリオ", sans-serif;
    font-weight: 500;
     position:relative; 
     margin: 0 4px 0 0;
     top:-1px;  
}

#container #form p + table{margin-top:5px;}

#form table{
    border-top:#dfdfdf 1px solid;
    width:100%;
    margin-bottom:45px;
}
#form table th,
#form table td{
    border-bottom:#dfdfdf 1px solid;
    vertical-align:top;
    padding:15px 0;
    text-align:left;
    line-height:1.85;
}
#form table td{padding-right: 5%;}
#form table td{vertical-align:middle;}
#form table th{
    width:220px;
    padding-top:22px;
	padding-left: 10px;
    font-weight:bold;
	font-size: 	0.938em;
    white-space:nowrap;}
    
#form table th span{color:#cc0000; margin-left:0.5em; font-weight: bold;}

#form table input[type="text"],
#form table input[type="email"],
#form table input[type="url"],
#form table textarea{
    background-color:#eaeaea;
    padding:5px 5px;
    width:100%;
}
#form table textarea{
    height:12em;
}

#form table td.chk > span,
#form table td.chk label{
    display:block;
    padding:2px 0;
}

#form table td p{ 
	font-size: 0.933em;
	line-height: 2;
	padding-bottom: 10px;
}
#form table td p + .mwform-checkbox-field label span{font-weight: bold;}

.btnThanks{ padding-top:10px;}
#form .btn input,
.btnThanks a{
    display:block;
    width:330px;
    max-width:90%;
    height:62px;
    border-radius:31px;
    margin:0 auto;
    background-color:#1c2b77;
    color:#fff;
    font-size:0.875em;
    line-height:62px;
	text-align: center;
    cursor:pointer;
    
  transition-property:background;
  transition-duration:.8s;
}
#form .btn input:hover,
.btnThanks a:hover{
    background-color:#1b34b0;
    }

.btnThanks {padding-top:60px;}

@media screen and (max-width: 999px) {
}
@media screen and (max-width: 767px) {
}
@media screen and (max-width: 374px) {
    /*iphone5*/
}

@media screen and (min-width : 1000px){
    .forTB,
	.forSP{display:none;}
	.forPC{display:inherit;}

    .ie8 body{
        min-width:1239px;
        max-width:100%;
        overflow-x:hidden;
    }

}