@charset "utf-8";
/* css カスタムプロパティ */
:root {
	/* !necessary define */
	--headerTop-height:110px;
	--blog-width:1024px;
	--font-sz-normal:16px;
	/* カラー */
	--bgcolor-menu:#DFF2FC;
	--bgcolor-menuactive:#78c8f3;
	--bg-glay:#EFEFEF;
	--menu-fontcolor:#666;
	--bgcolor-submenu:#a6d7f1;
	--background-color:#DFF2FC;
	--title-back:#00428b;
	/* fontサイズ */
	--font-sz-menu:13.4px;
	--font-sz-middle:130%;
	--font-sz-biger:148%;
	--font-sz-super:250%;
	--font-sz-small:80%;
	--font-sz-verysmall:65%;
	--font-sz-minimum:10px;
	/* fontカラー */
	--font-blue:#5581b1;
	--headerTop_height:calc(110px);
	/* mobile mode */
	--arrange-method:flex;
}

@media only screen and (max-width: 768px) {
	:root {
		/* !necessary define */
		--headerTop-height:115px;
		--font-sz-normal:14px;
		/* option */
		--font-sz-middle:115%;
		--font-sz-biger:150%;
		--font-sz-super:165%;
		/* mobile mode */
		--arrange-method:block;

		--feature-margin:2.9%;
	}
}
@media only screen and (max-width: 400px) {
	:root {
		/* !necessary define */
		--headerTop-height:80px;
	}
}
@media only screen and (min-width: 680px) {
	:root {
		--font-sz-normal:15px;
		--feature-margin:6%;
	}
}
@media only screen and (min-width:769px) and (max-width:1023px ){
	:root {
		--blog-width:100%;
	}

}

.onlyPrint-pagefeed {
	display:none;
}
.anchoradj{
/*
	margin-top:calc( (var(--headerTop_height) + 10px) * -1)!important;
	padding-top:calc( var(--headerTop_height) + 10px)!important;
*/
}
body{
	font-size:var(--font-sz-normal)!important;
}

#company_header {
	margin:0;
	height:var(--headerTop-height);
}

no-underspace,
.toiform img,
p.addcomment,
.pointbox .intext,
.toibar,
.upper_title p,
section#pg2 h2 img,
#company_header img,
.toiform table,.toiform table img,
.footer_button img,
.masuda img
{
    margin-bottom: 0!important;
}
.company-main-class {
    margin-top: 0;
	margin-bottom:0;
}
.navDrawr {
	z-index:10;
}

.narrow {

    width: 760px;
    margin: 0 auto;
}

.narrow_ln_space{
	/* ボトムマージンを調整して行間を詰める */
	margin-bottom:0px!important;	
	line-height:1.6em!important;
}

.headerTop,.footer-contents {

	max-width:var(--blog-width);
	margin:0 auto;
}

p { margin:0;}



main p{
	margin-top:0.1em;
	margin-bottom:20px;
	line-height:2.3em;
}

main img {
	max-width:100%;
	height:auto;
	margin-bottom:20px;
}

.bottom_space {
	margin-bottom:20px;
}

video {
	margin-bottom:20px;	
}

.container {
	width:var(--blog-width);
	margin:0 auto;
}

.header-contents {
    display: flex;
    justify-content: center;
	align-items:center;
}


.headtel {
	position:relative;
	padding:8px 10px 0;
	height:50px;
}
.eigyo{
	width:100%;
	margin-top:-11px;
	font-size:var(--font-sz-verysmall);
	text-align:center;
	line-height:1.6em;
	
}
.headcontact {
	padding-top:14px;
}
.headcontact img{
	width:73px;
}
.bodytel{
	display:none!important;
}

.uketuke {
	font-size:var(--font-sz-verysmall);	
}
.top_banner {
	margin-top:10px;
	margin-bottom:00px;
}
h1 {
    font-size: var(--font-sz-verysmall);
    margin: 0;
    padding: 0;
}

h2 {
	font-size: var(--font-sz-normal);	
}

h2 img{
	margin-top:20px;
    max-width: 400px;
	
}
h2 img.top_banner {
	margin-top:0;
	max-width:100%;
}

.article-content h2 {
    font-size: var(--font-sz-super);
    margin: 40px auto 20px;
    margin-bottom: 20px;
}

.aligncenter,.aligncenter img,.aligncenter p {
	clear: both;
	display: table;
	margin-left: auto;
	margin-right: auto;
	
	text-align:center;
}

table.noborder,
table.noborder tr,
table.noborder td {
	border:none;
}


p.highlight {
	font-size:var(--font-sz-biger);
	font-weight:600;
	line-height:1.6em;
	margin-bottom:20px;
	text-align:center;
}
p.highlight-m {
	font-size:var(--font-sz-middle);
	font-weight:bold;
	line-height:1.6em;
	margin-bottom:20px;
	text-align:center;
}
p.highlight-s {
	font-size:var(--font-sz-normal);
	font-weight:bold;
	line-height:1.6em;
	margin-bottom:20px;
	text-align:center;
}

p.highlight_blue {
	font-size:var(--font-sz-biger);
	font-weight:bold;
	line-height:1.6em;
	margin-bottom:20px;
	text-align:center;

	color:var(--font-blue);
}
p.smalltext {
	font-size:var(--font-sz-small);
}


.navDrawr>ul {
	margin:0;
	padding-left:0;
	padding-right:0;
	background-color:var(--bgcolor-menu);
}

.navDrawr li {
	box-sizing: border-box;
 	width: calc( 100% / 8  )!important;
   	border-right: 1px solid #fff;
	padding:0;
}
.navDrawr>ul>li>a {
    border-right:none!important;
	padding:10px 3px;
	color: var(--font-blue);
}


.navDrawr li:first-child {
    border-left: 1px solid #fff;
}

.navDrawr a {
    display: block;
    color: var(--fontcolor-menu);
    text-decoration: none;
    background: var(--bgcolor-menu);
    padding: 10px;
	font-size:var(--font-sz-menu);
}

.clearfix:after {
	visibility: hidden;
	display: block;
	font-size: 0;
	content: " ";
	clear: both;
	height: 0;
}
.gotop {
	text-align:right;
	font-size:var(--font-sz-small);
	margin:3px 20px 3px 0;
}
.gotop:before {
	font-family: FontAwesome;
	content: "\f015";
	font-size: 16px;
	color: #000;
	padding-right:3px;

}

/* ポイントマーク付きテキスト */
.pointbox {
    /*　background-color:pink; for debug */
    margin:-108px auto 40px;
    display:table
}
.pointbox-1 {
   margin:-75px auto 40px;
}
.pointbox-2 {
   margin:-65px auto 40px;
}
.pointbox-3 {
   margin: -79px auto 40px;
}
.pointbox .intext {
	position:relative;
	font-size:var(--font-sz-super);
	font-weight:bold;
	padding-top: 97px;
	padding-left: 94px;

	z-index:-1;
}
.pointbox-2 .intext {
	line-height:1.6em;
}
.pointbox-1 .intext:before,
.pointbox-3 .intext:before {
    content:"";
    background-image:url(../user-images/page3_06.png);
    background-size:128px;
    background-repeat:no-repeat;
    position:absolute;
    top:0;
    left:0;
    width:128px;
    height:128px;
}
.pointbox-2 .intext:before {
    content:"";
    background-image:url(../user-images/page6_06.png);
    background-size:128px;
    background-repeat:no-repeat;
    position:absolute;
    top:0;
    left:0;
    width:128px;
    height:128px;
}

/* ここまで */
.addcomment {
	text-align:center;
	font-size:var(--font-sz-normal);
}
.comment_blue {
	color:var(--font-blue);
}
/*--------------
ブルーのバックカラー
----------------*/
section{
	box-sizing:border-box;
}
.sectiondef {
	font-size:var(--font-sz-normal);
	padding:30px 20px 10px;

	z-index:-1;
}
section#pg2,
section#pg3-1,
section#pg6-1 {
	background-color:var(--background-color);
/*	position:relative;	 */

    width: 100%;


}
section#pg5 {
	background-color:var(--background-color);
/*	position:relative; */

    width: 100%;
    padding: 40px 0 10px;
}
section#pg8-1 {
l/*	position:relative;	*/

    width: 100%;
    padding: 0 0 40px;
	background-color:var(--bg-glay);
	
}
section#pg9 {
	padding-left:0;
	padding-right:0;
}
.toibar{
	max-width:80%;
}

.fig-1{
	position:absolute;
	top:1580px;
	left:30%;
	
}
.fig-2{
	position:absolute;
	top:1580px;
	left:63%;
	
}
.fig-3{
	position:absolute;
	top:2002px;
	left:30%;
	
}
section#pg0 {
    padding-top: 0;
	padding-bottom:0;
}
/*--------------
PAGE 1
----------------*/

section#pg1 {
    padding-top: 10px;
}
/*--------------
PAGE 2
----------------*/

.feature {
    width: calc( 100% / 3 - 30px );
    float: left;
    margin:0 15px 30px;
    height: 388px;
	background-color:#EFEFEF;
	font-size:var(--font-sz-small);
}
.feature-banner {
	padding:0;
}
.feature-text {
	padding:0 30px;
}
.feature-text p.ptext {
	line-height:1.6em;
}
.feature-text .highlight {
    margin-bottom: 16px;
}
.feature.feature_annai {
    background-color: var(--background-color);
}
/*--------------
PAGE 3
----------------*/

.toiform {
	padding-top:20px;
	padding-bottom:10px;
	width:calc( 355px  * 2 );
	margin:0 auto;
}
.toiform-blue {
	background-color:var(--background-color);
}


.toiform table th,
.toiform table tr:nth-of-type(2n+1) {
  background-color: initial;			/* コクーンのたーブル仕様をリセット */
}

.toiform a {
	cursor:pointer;
}
/*--------------
PAGE 4
----------------*/
.douga {

	margin-top:20px auto;
	max-width:100%;


}
.douga1 {
	display:block;
	margin:20px auto;
}

/*--------------
PAGE 5
----------------*/
section.pg5 {
	background-color:var(--background-color);	
}

.pg5msg1{
	box-sizing:border-box;
	padding:10px 20px;
	
}
.pg5sect{
	position:relative;	
}
.pg5left{
	float:left;
	width:50%;
	
}
.pg5right{
	float:right;
	width:50%;
}
.pg5mid{
    position: absolute;
	width:101px;
	height:36px;
    top: 205px;
    left: 50%;
    transform: translate( -50%, -50% )!important;
    -webkit-transform: translate( -50%, -50% )!important;
    -moz-transform: translate( -50%, -50% )!important;	
}

.msvideos1 {
	width:600px;
}
.msvideos2,.msvideos3 {
	width:425px;
}

/*--------------
PAGE 6
----------------*/
.pg6sect1 .threepeace {
    width: calc( 100% / 3 - 10px );
	float:left;
	background-color:var(--bg-glay);
	height:290px;	
	margin:0 5px 20px;
}
.pg6sect1 .threepeace p.title{
	background-color:var(--title-back);
	color:white;
	font-weight:600;
	font-size:var(--font-sz-biger);
	text-align:center;
	padding-top:16px;
	padding-bottom:16px;
	margin-bottom:20px;
	
}
.pg6sect1 .threepeace p.addtext{
    padding:0 20px;
   	color: var(--font-blue);
	line-height:1.6em;
}
.pg6sect1 .threepeace img {
    padding-top: 20px;
}

.pg6sect2 {
    font-size: smaller;
}

.pg6sect2 .titlebar {
	background-color:var(--title-back);
	background-color: var(--title-back);
	width: calc( 100% - 10px );
	margin: 0 5px;
}
.pg6sect2 .titlebar p.title {
	font-weight:600;
	font-size:var(--font-sz-biger);
	color:white;
	text-align:center;
	margin-bottom:3px;
	padding-top:16px;
	
}
.pg6sect2 .titlebar p.subtitle {
	font-weight:600;
	font-size:var(--font-sz-normal);
	color:white;
	text-align:center;
	margin-top:3px;
	margin-bottom:3px;
	
}
table.jobs{
	table-layout:fixed;
	border:1px black solid;
	border-collapse: collapse;	
	
}
table.jobs tr,table.jobs th,table.jobs td {
	border:1px black solid;
}
table.jobs tr td:nth-child(1) {
	width:160px;
}
table.jobs tr td:nth-child(2) {
	width:200px;
}
table.jobs th,
table.jobs td {
	border: 1px solid #ddd;
	padding: 5px 3px 3px;
	line-height:1.6em!important;
}
.pg6table1,.pg6table2,.pg6table3 {
	float:left;	
	margin:10px;
	width:calc(100% / 3 - 20px)
}
.jobs caption {
	font-weight:bold;
	text-align:left;
}
.tbusage{
	clear:both;
}
/*--------------
PAGE 7
----------------*/
ul.syokusyu {
	padding-left:0;
	
}
ul.syokusyu li {
	list-style:none;
	background-color:#DFF2FC;
	/* 角丸 */
	border-radius:8px;-moz-border-radius:8px;-webkit-border-radius:8px;
	box-shadow:1.5px 1.5px #066;
    width: calc( 25% - 24px);
	margin:12px!important;
	padding:12px;
	float:left;
	padding-left:1.5em;
	text-indent:-1.5em;
	}
ul.syokusyu li:before {
	font-family: FontAwesome;
	content: "\f111";
	font-size: 16px;
	color: #85ccf1;
	padding-right:3px;
	padding-left:12px;
	height:48px;
}
li.syo-7 {
	font-size:var(--font-sz-small);
}
li.syo-14{
	font-size:var(--font-sz-verysmall);
}
/*--------------
PAGE 8
----------------*/
.pg8back{
	background-color:var(--bg-glay);
	position:relative;
	z-index:-1;
}
.question_block {
	border-top:1px solid #0000ff;
	margin-bottom:32px;	
	background-color:white;
	position:relative;
	z-index:-1;
}
.question_text {
	font-weight:bold;
}
.question_text,.answer_text {
	position:relative;
	line-height:32px;
	padding-top:10px;
	padding-left:40px;

/*	z-index:-1; */

}
.question_text:before {
	content:"";
	background-image:url(../user-images/page8_07.png);
	background-repeat:no-repeat;
	background-size:32px 32px;
	padding-right:32px;
	position: absolute;
	top:10px;
	left:0;
	height:40px;
	width:40px;
}
.answer_text:before {
	content:"";
	background-image:url(../user-images/page8_09.png);
	background-repeat:no-repeat;
	padding-right:32px;
	background-size:32px 32px;
	position: absolute;
	top:10px;
	left:0;
	height:40px;
	width:40px;
}




/*--------------
PAGE 9
----------------*/
section#pg9 {
	background-color:var(--background-color);
	margin-bottom:0;
}
.pg9contact {
	
}

.pg9contact {
	display:flex;
	justify-content:center;
	align-items:center;
}


.pg9contact img {
    width:510px;
}

.pg9contact_lady {
	width:200px;
	padding-left:10px;
}

/*--------------
footer
----------------*/
#company_footer {
	margin:0;
	padding:8px 0 0;
}
.footer-contents {
    display: flex;
    flex-direction: row;
	justify-content:center;
	padding-left:20px;
    padding-right:20px;
}
.footer_menulist{
	display:flex;
	margin-left:20px;
}
.footer_menulist ul {
    width: 140px;
    float: left;
	padding-left:0;
}
.footer_menulist li{
	float:left;
	padding-left:0;
	padding-top:4px;
	padding-bottom:4px;
	width:137px;
	font-size:var(--font-sz-small);
	list-style:none;
}
.footer_menulist li:before {
	content:"\f0da";
	font-family: FontAwesome;
	padding-right:6px
	color:var(--font-blue);
}
.footer_menulist li a {
	color:var(--font-blue);
}
.footer_button {
	display:inline-block;
	margin:0;
}
.footer_log_image {
	width:320px;	
}

.footer_menulist li {
	 margin: 0!important;
    padding: 0!important;
}
header-contents,
footer-contents {
	display:var(--arrange-method);
	flex-direcction:row;	
}
.copyright {
    margin: 8px auto 0;
    padding: 8px 80px;
    /* padding-right: 80px; */
    background-color: #00428b;
    color: white;
    text-align: center;
	font-size:var(--font-sz-small);
}

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

	.content{
		margin-top:0;
	}
	img {
		max-width:100%;
	}

	h2 img{
		margin-top:20px;
		max-width:100%;
	}
	.navDrawr li{
		width:initial!important;
	}
	.bottom_space {
		margin-bottom:10px;
	}
	video {
		max-width:calc( 100% - 20px );
		margin:0 auto;
	}
	
	#company_header .headerTop {
		background-color: white;
/*		position: fixed; */
		z-index: 10;
		height: var(--headerTop-height);
		width:100%;
		padding-top:10px;
	}


	.headerTop {
/*
		width: calc( 100% - 60px );
		height:var(--headerTop_height);
*/
	}
	.container {
		width:100%;
	}
	main {
		/*margin:10px;*/
		margin:0px;
	}
	.narrow {
		width: 100%;
		margin: 0 auto;
	}

	.headtel{
		display:none;
	}
	.headcontact {
		display:none;
	}
	.bodytel{
		display:block!important;
		margin-top:10px;
		margin-bottom:10px;
	}
	.bodytel img {
		width:160px;
		margin-bottom:0;
	}

	.top_banner {
		margin-top:0;
		margin-bottom:10px
	}

	.sectiondef {
		padding:30px 10px 10px;
		z-index:-1;
	}

	.pg3, .pg6 {
		background-color: var(--background-color);
		padding-top: 15px;
		padding-bottom: 15px;
	}	

	#features {
		display: flex;
		flex-wrap: wrap;
		justify-content: center;
	}
	.feature {
		width: calc( 100% / 2 - var(--feature-margin) * 2  );
		min-width:156px;		
		margin:20px var(--feature-margin);
		padding:0;
	}
	.feature-banner {
	}
	.feature-text {
		padding:0 8%;
	}
	.feature1,.feature2 {
		height:433px;
	}
	.feature3,.feature4 {
		height:325px;
	}
	.feature5,.feature_annai {
		height:337px;
	}

	.pointbox {
	    margin:-51px auto 20px;
	    display:table
	}
	.pointbox-2 {
	   margin:-45px auto 20px;
	}
	.pointbox .intext {
		padding-top: 80px;
		padding-left: 5px;
		height: 128px;
	}
	.pointbox-2 .intext {
		padding-top: 80px;
		padding-left: 24px;
		height: 160px;
	}

	.pointbox-1 .intext:before,
	.pointbox-2 .intext:before,
	.pointbox-3 .intext:before {
	    content:"";
	    top:0;
	    left:0;
	    background-size:86px;
	    width:86px;
	    height:86px;
	}

	.douga2,.douga3 {
		display:block;
		margin:20px auto;
	}
	ul.syokusyu {
    	padding:0;
    }
	ul.syokusyu li {
		box-sizing:border-box;
		width: calc( 50% - 24px );
		margin:5px;
		height:42px;
		overflow:hidden;

	}
	.pg5sect{
		position:initial;	
	}
	.pg5mid{
		display:none;
	}
	.pg6table1,.pg6table2,.pg6table3 {
		width:calc( 100% - 20px );
	}
	table.jobs{
		margin:0 auto;
	}
	.pg6sect1 .threepeace {
		margin:20px 5px;
		height:264px;
	}
	.pg6sect1 .threepeace p.title1 {
	    font-size: var(--font-sz-small)!important;
		height:74px;
		line-height:4em;

	}
	.pg6sect1 .threepeace p.addtext{
    	padding: 0 5px;
	}
	.pg5left,
	.pg5right {
		float:none;
		width:auto;
	}

	
	.msvideos1,
	.msvideos2,
	.msvideos3 {
		width:95%;
		margin:0 auto;
	}
	.footer-contents {
		height:157px;
		margin:0 10px;

	}
	

	.footer_link {
		text-align:center;
	}
	.footer_menulist {
		display:none;
	}

	.footer {
		margin:0 auto;
	}
/*	.pg9contact_icon { width:30%;} */
	.pg9contact_number {
		width:70%;
	}
	.pg9contact_lady {
		width:30%;
	}

	.copyright {
		font-size:10px;
	}
}
@media only screen and (max-width: 400px) {
	.pg6sect1 .threepeace {
		height:300px;
	}
	.pg6sect1 .threepeace p.title{
		margin-bottom:10px;
	}
}
@media only screen and (min-width:769px) and (max-width:1023px ){


	.bodytel{
		display:none;
	}
	ul.syokusyu li {
		font-size:var(--font-sz-verysmall);
		width: calc( 25% - 24px);
		margin: 10px 12px;
		padding:3px 12px;
		height:39px;
		line-height:30px;
		overflow:hidden;
	}

	.feature {
	    width: calc( 100% / 3 - 30px );
	    margin:0 15px 30px;
	    height: 440px;
/*
	    float: left;
		padding:20px 25px;
		background-color:white;
		font-size:var(--font-sz-small);
*/
	}
	.pg6sect1 .threepeace p.title1 {
	    font-size: var(--font-sz-normal)!important;
		height:82px;
		line-height:4em;
	}
	section#pg2,
	section#pg3-1,
	section#pg6-1,
	section#pg5 {
	    padding: 40px 3% 10px;
	}
	/* ロゴ（タブレット） */
	.upper_title,.under_title{
		left:64px;
	}
	.headtel {
		width:200px;
	}
	.headcontact img{
		width:60px;
	}


	.fig-1,.fig-2,.fig-3 {
		display:none;
	}

}

@media print {

	.onlyPrint-pagefeed {
		display:block;
		break-after:page;		/** 強制改行 */
	}

	ul.syokusyu li {
	    width: calc( 25% - 12px);
	    margin: 6px!important;

	}
	.feature {
	    height: 480px;
	}
	.feature-text {
		padding:0 15px;
	}
	
	.pg5upper_text {
		min-height:6.4em;	
	}
	.pg5bottom_text{
    	min-height:6.4em;  
	}

	.fig-1,.fig-2,.fig-3,.douga1,.douga2,.douga3 {
		display:none;
	}
}


