/* CSS Document */
html{ height:100%;}
body{ background:#fff; height:100%; }
h1,h2,h3,p{ line-height:1.2em;}
img{ max-width:100%; vertical-align:bottom;}
.contents{ /*width:960px*/; max-width:100%; background:#fff; margin:0 auto; padding-bottom:60px;}
.contents p.text{ font-size:1.4em; line-height:1.6em; padding:10px;}
.contents p{ text-align:left;}
.sp{ display:none;}

hader .nav ul{}
hader .nav ul li{ width:100px; border:5px solid #171b60; display:inline-block; margin-right:10px;}
hader{ width:1190px; max-width:100%; margin:0 auto;}
.header_top{ /*width:960px;*/
 max-width:100%; position:relative; text-align:left; 
 border-bottom: solid 4px #171b60;
    margin: 0;
    padding: 0 28px;}

header ul.contact_btn{ position:absolute;  right:25px; bottom:14px;}
header ul.contact_btn li{ display:inline-block; line-height:27px; font-size:1.1em;}

header ul.nav{ width:830px; margin:20px auto;  max-width:100%; }
header ul.nav li{ display:inline-block; width:113px; height:113px; border:6px solid #171b60; margin:0 60px 0 0; position:relative; box-sizing:border-box; }
header ul.nav li:before{  content: ''; display:block; padding-top:100%;}
header ul.nav li:nth-child(5){ margin-right:0;}
header ul.nav li img{ max-width:95%; margin:auto; position:absolute; top:0; bottom:0; left:0; right:0;}



#footer_wrap{ background:url(../images/footer_bg.png) repeat-x; width:100%; color:#fff; padding-bottom:30px;}
footer{ /*width:960px;*/ max-width:90%; text-align:left; margin:0 auto;}

footer .left_box h1{ padding:36px 0;}
footer .left_box{ width:100%;}
footer .left_box p{ padding:0 0 0 5px; font-size:1em; line-height:1.6em;}
footer .left_box p span{ font-size:1.2em;}
footer .right_box{ margin-left:0; margin-top:15px;text-align: right;}
footer .right_box ul{ padding:2px 0;}
footer .right_box ul li{ font-size:1em; padding-bottom:20px; display:inline-block; margin-right:10px;}
footer .right_box ul li a{ color:#fff;}
footer p.copy{ text-align:right;}

#top ul.nav{ overflow:hidden; width:690px; max-width:95%; margin:50px auto;}
#top ul.nav li{ width:205px; height:205px; border:8px solid #171b60; float:left; margin:0 30px 30px 0; position:relative; box-sizing:border-box; }
#top ul.nav li:before{  content: ''; display:block; padding-top:100%;}
#top ul.nav li:nth-child(3),#top ul.nav li:nth-child(6){ margin-right:0;}
#top ul.nav li img{ max-width:95%; margin:auto; position:absolute; top:0; bottom:0; left:0; right:0;}
#top .blog h1{ width:300px; margin:30px auto; border-left:1px solid #717071; border-right:1px solid #717071; font-size:1.8em; line-height:1.2em; padding:0 15px;}
/*#top .blog div{ max-width:85%; margin:0 auto; padding:20px 30px; border:1px solid #717071; }*/
#top .blog dl{ font-size:1.2em; line-height:1.4em; text-align:left; overflow:auto; padding:10px;}
#top .blog dl dt{font-size: 0.8em;
    margin-bottom: -7px;
    padding: 1px 5px;
    background-color: #171b60;
    color: white;
    display: inline;
}

.blog{
	overflow:hidden;
}

.blogsim{
	width:95%;
	margin:0 auto;
  overflow-x: scroll;
  -webkit-overflow-scrolling: touch;
  padding: 0 0 12px 8px;
  display: -ms-flexbox;
  display: flex;
}
.blogsim li{
	width:15%;
	margin:5px 1%;
	float:left;
	overflow:hidden;
	min-width: 250px;
}
.blogsim li p{
	font-size: smaller;
}
.imgarea{
	max-width:100%;
	max-height:130px;
	overflow:hidden;	
}
.blogsim img{
	max-width:100%;
}

.img22{
	margin:15px 0;
	overflow:hidden;
}

.img22 ul{
	margin-bottom:20px;
	
}

.img22 ul li{
	width: 24%;
    float: left;
    margin: 0.5%;
}

#top .blog dl dd{ font-weight:bold;}

#company h2{ text-align:left;}
#company p{ font-size:1em; line-height:2em; padding-left:55px;}
#company dl{ padding-left:55px;}
#company dl dt{ width:50px; text-align-last: justify; text-justify: inter-ideograph; font-size:1em; line-height:1.6em; float:left; padding-bottom:5px;}
#company dl dd{ margin-left:80px; text-align:left; font-size:1em; line-height:1.6em; text-indent:-1em; padding-bottom:5px;}
#company .sec1,#company .sec2{padding-left:0; margin:0 auto 60px; max-width:90%; position:relative;}
#company .sec1{width:690px;}
#company .sec2{width:100%;}
#company .sec1 img.photo{ position:absolute; left:0; top:0;}
#company .sec1 h2{ padding-left:50px;}
#company .sec2 img.photo{ position:absolute; right:60px; top:30px;}
.etobk{width:100%;background-image:url(../images/rec/eto.jpg);background-repeat: no-repeat;background-attachment: fixed;}

#recruit .recruit_wrap{ position:relative; width:100%;}
#recruit .recruit_wrap .img{ width:101px; position:absolute; right:30px; top:0; z-index:10;}
#recruit .recruit_wrap .img img{ margin-bottom:7px;}
#recruit dl{ width:850px; max-width:95%; margin:0 auto; display:flex; justify-content: space-between; flex-wrap: wrap; }
#recruit dl dt,#recruit dl dd{ font-size:1em; line-height:1.4em; border-bottom:1px solid #595757;}
#recruit dl dt{ width:7em; text-align-last: justify; text-justify: inter-ideograph; padding:15px 40px 15px 15px; border-bottom:none;}
#recruit dl dd{ width:calc(100% - 130px - 7em); text-align:left; padding:15px 0 15px 60px; position:relative;}

#recruit dl dd:before{position:absolute; left:13px; top:7px;}
#recruit dl dd:nth-of-type(1):before{ content:url(../images/recruit_icon1.png);}
#recruit dl dd:nth-of-type(2):before{ content:url(../images/recruit_icon2.png);}
#recruit dl dd:nth-of-type(3):before{ content:url(../images/recruit_icon3.png);}
#recruit dl dd:nth-of-type(4):before{ content:url(../images/recruit_icon4.png);}
#recruit dl dd:nth-of-type(5):before{ content:url(../images/recruit_icon5.png);}
#recruit dl dd:nth-of-type(6):before{ content:url(../images/recruit_icon6.png);}
#recruit dl dd:nth-of-type(7):before{ content:url(../images/recruit_icon7.png);}
#recruit dl dd:nth-of-type(8):before{ content:url(../images/recruit_icon8.png);}
#recruit dl dd:nth-of-type(9):before{ content:url(../images/recruit_icon9.png);}
#recruit dl dd:nth-of-type(10):before{ content:url(../images/recruit_icon10.png);}
#recruit dl dd:nth-of-type(11):before{ content:url(../images/recruit_icon11.png);}
#recruit dl dd:nth-of-type(12):before{ content:url(../images/recruit_icon12.png);}
#recruit .recruit_btn{ width:240px; margin:30px auto; background:#171b60; padding:15px 30px;}
#recruit a .recruit_btn{ color:#fff;}
#recruit .recruit_btn:hover{ background:#1D38A5;}



#business p{ width:800px; max-width:90%; margin:10px auto 50px; font-size:1.2em; line-height:1.6em; text-align:left;}
#business .box{ width:830px; max-width:100%; margin:0 auto 40px; height:170px; border:7px solid #b4b5b5; box-sizing:border-box; overflow:hidden; }
#business .box h2{ width:170px; height:100%; float:left; position:relative; }
#business .box h2 img{ position:absolute; top:0; left:0; bottom:0; right:0; margin:auto;}
#business .box ul { overflow:hidden; border-left:7px solid #b4b5b5; padding-bottom:10px;}
#business .box ul li{ float:left; padding:16px 15px 15px 40px; }


#contact h2,#contact p{ font-size:1.4em; line-height:1.4em; text-align:left; width:420px; max-width:90%; margin:5px auto;}
#contact p{ font-size:1.1em;}
#contact .tel{ margin:60px auto; padding-left:40px;}
#contact dl{
	width:420px;
	max-width:90%;
	margin:30px auto;
	font-size:1em;
	line-height:1.4em;
}
#contact dl dt {
	float: left;
	width: 135px;
	clear: both;
	padding: 10px 0px;
	text-align: left;
	margin: 0px;
	line-height:20px;
}
#contact dl dt.nomust{width: 95px; padding-left:40px;}

#contact dl dd {
	margin: 0px;
	padding: 10px 5px 10px 140px;
	line-height: 1.5em;
	text-align: left;
}
#contact input{ width:300px; max-width:100%; border:1px solid #221814;}
#contact .check li{}
#contact .check input{ width:auto; max-width:auto; margin:0 8px 0 0; vertical-align:bottom; border:none;}
#contact .check label{ width:175px; display:block; border:1px solid #221814; padding:7px 5px; margin-bottom:3px;}
#contact div.buttons button{ width:140px; padding:5px; border:none; text-align:center; background:#171b60; color:#fff; font-size:1.4em; line-height:1.4em;    border-radius: 3px;        /* CSS3草案 */  
    -webkit-border-radius: 3px;    /* Safari,Google Chrome用 */  
    -moz-border-radius: 3px;   /* Firefox用 */
}
#contact textarea{width:300px; max-width:90%; min-width:300px; min-height:100px; border:1px solid #221814;}
#contact .must {
	display: block;
	background-color: #a84b76;
	padding: 1px 5px;
	line-height:20px;
	font-size: 1em;
	color: #FFF;
	float: left;
	margin: 0px 5px;
    border-radius: 2px;        /* CSS3草案 */  
    -webkit-border-radius: 2px;    /* Safari,Google Chrome用 */  
    -moz-border-radius: 2px;   /* Firefox用 */
}
#results { width:1090px; max-width:95%; margin:0 auto;}
#results h2{ width:177px; height:122px; position:relative; background:#a79186; float:left; clear:both;}
#results h2 img{ position:absolute; top:0; left:0; bottom:0; right:0; margin:auto;}
#results .box{ margin-left:180px;}
#results h3{ width:113px; float:left; padding:30px 0 0 0;}
#results h3:after{ content:url(../images/result_image.png)}
#results ul{ margin:0 0 30px 113px; text-align:left; font-size:0px;}
#results ul li{ max-width:46%; display:inline-block; margin:0 2% 2% 0; }


/*グーぐるマップ*/
.gmap {
position: relative;
padding-bottom: 35%;
height: 0;
overflow: hidden;
max-width:100%;
margin:30px 0 0;
border:1px solid #CCCCCC;
}
 
.gmap iframe,
.gmap object,
.gmap embed {
position: absolute;
top: 0;
left: 0;
width: 100%;
height: 100%;
}

.jn{
	width:90%;
	margin:0 auto;
	overflow:hidden;
	
}

.jnd{
	width:32%;
	margin:0 0.5% 10px;
	float:left;
}

.jnd h2{
	padding:7px 15px;
	background-color:#171b60;
	color:#FFFFFF;
	text-align:left;
}

.jnd h2 img{
	margin-right:10px;
}


.jnds{
    width: 100%;
    overflow: hidden;
    background-color: #171b60;
	color:#FFFFFF;
}

.jndsl{
	width:15%;
	float: left;
}

.jndsr{
	width:80%;
	float: left;
    margin: 5px 0;
	text-align:left;
}

.hdenk{
	background-image:url("/images/h1d.jpg");
    height: 1px;
    text-align: left;
    font-size: xxx-large;
    padding: 147px;
    color: #171b60;
}
.hkank{
	background-image:url("/images/h1k.jpg");
    height: 1px;
    text-align: left;
    font-size: xxx-large;
    padding: 147px;
    color: #171b60;
}
.hkucho{
	background-image:url("/images/h1c.jpg");
    height: 1px;
    text-align: left;
    font-size: xxx-large;
    padding: 147px;
    color: #171b60;
}

.boxj{
	width:1080px;
	max-width:96%;
	margin:2% auto;
	text-align:left;
}

.jss{
	width:100%;
	overflow:hidden;
	clear:both;
}

.jssl{
	width:400px;
	max-width:100%;
	float:left;
}

.jssr{
	width:620px;
	margin-left:10px;
	max-width:100%;
	float:left;
}

/*1120以下 */
@media screen and (max-width: 1020px){

}


/*960以下
 */
@media screen and (max-width: 960px){
#top .blog div{ padding:3%;}
header ul.nav li{  margin:0 20px 0 0; }
#company .sec1,#company .sec2{ padding-left:0; margin:0 auto 40px; text-align:left; }
#company .sec1 img.photo{ position:relative; left:auto; top:auto; margin:0 0 20px 55px;}
#company .sec2 img.photo{ position:relative; right:auto; top:auto; margin:0 0 20px 55px;}


#business .box{ width:750px; max-width:95%; margin:0 auto 30px; border:6px solid #b4b5b5;  }
#business .box h2{ width:140px; }
#business .box ul{ border-left:6px solid #b4b5b5;}
#business .box ul li{ padding:16px 10px 10px 15px; }


#results h2{ width:127px; height:102px;}
#results .box{ margin-left:130px;}
#results h3{ width:93px; padding:20px 0 0 0;}
#results ul{ margin:0 0 20px 93px;}

}


/*800以下
 */
@media screen and (max-width: 800px){
	
}





/*767以下 ipadを含まない*/
@media screen and (max-width: 767px){
br.no{ display:none;}
#top ul.nav li{ max-width:31%; height:auto; margin:0 3% 3% 0; border:7px solid #171b60;}
header ul.nav li{ max-width:18%; margin:0 1% 0 0; height:auto; border:4px solid #171b60;}
#recruit .recruit_wrap .img{ width:220px; position:relative; right:auto; top:auto; margin:0 auto 30px;}
#recruit .recruit_wrap .img img{ margin-bottom:0; margin-right:7px;}

#business .box{ width:560px; height:140px; margin:0 auto 20px; border:5px solid #b4b5b5;  }
#business .box h2{ width:100px; }
#business .box ul{ border-left:5px solid #b4b5b5;}
#business .box ul li{ max-width:30%; padding:7px 1.5% 7px 1.5%; }

#results ul li{ max-width:48%; margin:0 2% 2% 0;}
#results h2{ width:87px; height:87px;}
#results h2 img{ width:46px;}
#results .box{ margin-left:110px;}
#results h3{ width:130px; padding:10px 0 0 0; float:none;}
#results h3 br.none{ display:none;}
#results ul{ margin:0 0 20px 0px;}


}


/*560以下 */
@media screen and (max-width: 560px){
.contents{padding-bottom:20px;}
.sp{ display:block;}
.pc{ display:none;}
.gmap {margin:20px 0 20px 0; padding-bottom: 55%;}
header ul.nav li{ max-width:18.5%; margin:0 0 0 0; border:2px solid #171b60;}
header ul.contact_btn{ position:relative; margin:0 0 0 20px; bottom:0; }
header ul.contact_btn li.text{ display:block;}
#footer_wrap{padding-bottom:20px;}
footer .right_box ul{ padding:35px 0;}
.header_top{padding: 0 13px;}
.header_top img{max-width:160px;}
.hlogon{width:45% !important;}
.yrpng{width:45% !important;}
.sgpng{max-width:70px !important;}
#top ul.nav{margin:20px auto;}
#top ul.nav li{ border:6px solid #171b60; max-width:32%; height:auto; margin:0 2% 2% 0;}
#top .blog h1{margin:10px auto;}
#top .blog dl{}
#top .blog dl dt{ width:100%; float:none; padding-bottom:5px;}
#top .blog dl dd{ margin-left:0;}

#company p{ line-height:1.6em; padding-left:0px;}
#company dl{ padding-left:0px;}
#company .sec1 h2{ padding-left:0px;}
#company .sec1 img.photo{ margin:0 0 20px 0px;}
#company .sec2 img.photo{margin:0 0 20px 0px;}


#business .box{  height:auto; border:4px solid #b4b5b5;}
#business .box h2{ width:80px;  padding-top:15px; }
#business .box h2 img{ position:relative;}
#business .box ul{ border-left:4px solid #b4b5b5;}
#business .box ul li{ max-width:47%; }


#contact dl dt {
	max-width:100%;
	float: none;
	width: auto;
	padding: 5px 0;
	text-align: left;
	line-height:20px;
}
#contact dl dt.nomust{width:135px; padding-left:0;}
#contact dl dt.nomust br{ display:none;}
#contact dl dd {
	clear: both;
	max-width:100%;
	border-top: none;
	padding: 5px 0;
	line-height: 1.5em;
}
#contact .tel{ margin:30px auto; padding-left:10px; text-align:left;}

.blogsim li{
	width:100%;
	overflow:hidden;
}

.img22 ul li{
	width: 48%;
    float: left;
    margin: 1%;
}
.jnd{
	width:100%;
	
}

.hdenk{
	background-position: right;
    height: 1px;
    text-align: left;
    font-size:xx-large;
    padding: 147px 20px;
}
.hkank{
	background-position: right;
    height: 1px;
    text-align: left;
    font-size:xx-large;
    padding: 147px 20px;
}
.hkucho{
	background-position: right;
    height: 1px;
    text-align: left;
    font-size:xx-large;
    padding: 147px 20px;
}

}
/*500以下 */
@media screen and (max-width: 480px){
#recruit dl{  display:block;}
#recruit dl dt{ border-bottom:dotted 1px #595757;  letter-spacing:0.2em; position:relative; text-align:left; width:auto; padding:10px 0 5px 60px; text-align-last:left;}
#recruit dl dd{  border-bottom:none;  padding:5px 0 15px 60px; text-align:left; width:auto;}

#recruit dl dd:before{position:relative; left:auto; top:auto;}
#recruit dl dd:nth-of-type(1):before{ content:"";}
#recruit dl dd:nth-of-type(2):before{ content:"";}
#recruit dl dd:nth-of-type(3):before{ content:"";}
#recruit dl dd:nth-of-type(4):before{ content:"";}
#recruit dl dd:nth-of-type(5):before{ content:"";}
#recruit dl dd:nth-of-type(6):before{ content:"";}
#recruit dl dd:nth-of-type(7):before{ content:"";}
#recruit dl dd:nth-of-type(8):before{ content:"";}
#recruit dl dd:nth-of-type(9):before{ content:"";}
#recruit dl dd:nth-of-type(10):before{ content:"";}
#recruit dl dd:nth-of-type(11):before{ content:"";}
#recruit dl dd:nth-of-type(12):before{ content:"";}



#recruit dl dt:before{ position:absolute; left:15px; top:4px;}
#recruit dl dt:nth-of-type(1):before{ content:url(../images/recruit_icon1.png);}
#recruit dl dt:nth-of-type(2):before{ content:url(../images/recruit_icon2.png);}
#recruit dl dt:nth-of-type(3):before{ content:url(../images/recruit_icon3.png);}
#recruit dl dt:nth-of-type(4):before{ content:url(../images/recruit_icon4.png);}
#recruit dl dt:nth-of-type(5):before{ content:url(../images/recruit_icon5.png);}
#recruit dl dt:nth-of-type(6):before{ content:url(../images/recruit_icon6.png);}
#recruit dl dt:nth-of-type(7):before{ content:url(../images/recruit_icon7.png);}
#recruit dl dt:nth-of-type(8):before{ content:url(../images/recruit_icon8.png);}
#recruit dl dt:nth-of-type(9):before{ content:url(../images/recruit_icon9.png);}
#recruit dl dt:nth-of-type(10):before{ content:url(../images/recruit_icon10.png);}
#recruit dl dt:nth-of-type(11):before{ content:url(../images/recruit_icon11.png);}
#recruit dl dt:nth-of-type(12):before{ content:url(../images/recruit_icon12.png);}

}
/*414以下 iphone縦*/
@media screen and (max-width: 414px){
#top ul.nav li{ border:4px solid #171b60;}
footer .left_box{ float:none;}
footer .right_box{ margin-left:5px;}
#business .box ul li{ float:none; max-width:93%; }


#results h2{ width:107px; height:67px; float:none; margin:50px auto 10px;}
#results .box{ margin-left:0;}

}

/*ここからseint追記*/
.company_img{
	width:100%;
}