@charset "utf-8";

/* ------ ------ ------ ------ ------ ------ ------ ------
 Common
 ----- ------ ------ ------ ------ ------ ------ ------ */
figure{
	margin: 0;
	padding: 0;
}
.pc-none{
	display: none;
}
.img{
	text-align: center;
	margin-bottom: 20px;
}
#main header+p{
	margin-bottom: 30px;
	padding: 0 10px;
}
.context{
	padding: 10px;
}
.entryBody h2{
    background: #ddf1e3;
    border-left: 6px solid #00a13a;
    padding: 5px 10px;
    font-size: 20px;
    font-weight: bold;
    margin-bottom: 20px
}
.entryBody h2 small {
	font-size: 0.8em;
	font-weight: normal;
}
.entryBody h3{
	font-weight: bold;
    border-left: 10px solid #00a13a;
    margin-bottom: 20px;
    margin-left: 15px;
    padding-left: 15px;
}
.entryBody section{
	margin-bottom: 40px;
}



/* ------ ------ ------ ------ ------ ------ ------ ------
 company
 ----- ------ ------ ------ ------ ------ ------ ------ */
.underBody #mainVisual{	background: #DAF4E2 url(../../img/company/mainv_pc.jpg) center top no-repeat;}
@media screen and (max-width: 640px) {.underBody.company #mainVisual{	background: #DAF4E2 url(../../img/company/mainv_sp.jpg) center top no-repeat;}}

/* ------ ------ ------ ------ ------ ------ ------ ------
 index
 ----- ------ ------ ------ ------ ------ ------ ------ */
.index .entryBody{
	padding-bottom: 40px;
	}
	.index .entryBody li{
		float: left;
		padding-bottom: 20px;
		width: 308px;
		margin-right: 20px;
	}
	.index .entryBody li a{
		display: block;
		color: #1B1B1B;
	}
	.index .entryBody li a span{
		display: block;
		margin-bottom: 20px;
		background: url(../img/arrow2.png) right center no-repeat;
	}
	.index .entryBody li.li03,
	.index .entryBody li.li06,
	.index .entryBody li.li09,
	.index .entryBody li.li12{
		margin-right: 0;
	}
	.index .entryBody li.li01,
	.index .entryBody li.li02,
	.index .entryBody li.li03{
		padding-bottom: 50px;
		}
		.index .entryBody li a{
			-webkit-transition: opacity 0.3s ease-out; -moz-transition: opacity 0.3s ease-out; -o-transition: opacity 0.3s ease-out; transition: opacity 0.3s ease-out;
		}
		.index .entryBody li a:hover{
			opacity: 0.6;
			}
			.index .entryBody li a span{
				display: inline-block;
				padding: 0 25px 0 6px;
				margin-bottom: 10px;
				font-weight: bold;
				font-size: 16px;
				background: url(../img/arrow2.png) right center no-repeat;
			}

		.index .entryBody li.li01 a,
		.index .entryBody li.li02 a,
		.index .entryBody li.li03 a{
			padding-top: 170px;
		}
		.index .entryBody li.li01 a{background: url(../../img/company/index/li01.jpg) no-repeat;}
		.index .entryBody li.li02 a{background: url(../../img/company/index/li02.jpg) no-repeat;}
		.index .entryBody li.li03 a{background: url(../../img/company/index/li03.jpg) no-repeat;}
@media screen and (max-width: 640px) {
	.index .entryBody p.mb30{
		display: none !important;
	}
	.index .entryBody ul{
		padding: 0 0px;
	}
	.index .entryBody li{
		float: none;
		padding-right: 0px;
		padding-bottom: 20px;
	}
	.index .entryBody li.li01,
	.index .entryBody li.li02,
	.index .entryBody li.li03{
		padding-bottom: 20px;
	}
	.index .entryBody li.li03{
		padding-bottom: 40px;
	}
		.index .entryBody li a{
			width: 300px;
			-webkit-background-size: 300px 150px; background-size: 300px 150px;
			}
			.index .entryBody li a span{
				display: inline-block;
				padding: 0 25px 0 6px;
				margin-bottom: 12px;
				background: url(../img/arrow2.png) right center no-repeat;
			}
			.index .entryBody li a+p{
				padding: 0 6px 0 6px;
			}
		.index .entryBody li.li01 a,
		.index .entryBody li.li02 a,
		.index .entryBody li.li03 a{
			width: 100%;
			padding-top: 160px;
		}
	.index .entryBody li.li01 a{
		background: url(../../img/company/index/li01.jpg) no-repeat;
	}
	.index .entryBody li.li02 a{
		background: url(../../img/company/index/li02.jpg) no-repeat;
	}
	.index .entryBody li.li03 a{
		background: url(../../img/company/index/li03.jpg) no-repeat;
	}
	.sp-none{
		display: none;
	}
	.pc-none{
		display: inline-block;
	}
}


/* ------ ------ ------ ------ ------ ------ ------ ------
 greeting.html
 ----- ------ ------ ------ ------ ------ ------ ------ */
.greeting .entryBody p{
    margin-bottom: 1em;
	line-height: 2;
	text-indent: 1em;
}
.greeting .entryBody p.msg {
    margin-bottom: .5em;
    padding: 0 1em;
    font-size: 1.4em;
    font-family: "ヒラギノ明朝 Pro W3", "Hiragino Mincho Pro", "HGS明朝E", "ＭＳ 明朝", serif;
	text-indent: 0;
    line-height: 1.6;
}
.greeting .entryBody p.ceoImg {
	text-indent: 0em;
	margin-bottom: 0;
    text-align: center;
}
.greeting .entryBody p.ceoImg img {
    height: 350px;
}
.greeting .entryBody p.name {
    margin: 2em 0 1em;
	text-align: right;
	text-indent: 0em;
	font-weight: bold;
}
.greeting .entryBody p.name + p.name {
    margin: 0;
}
.greeting .entryBody p.name span {
    display: block;
    font-size: 1.6em;
    line-height: 1;
}

@media screen and (max-width: 640px) {
.greeting .entryBody p.msg {
    padding: 0;
    font-size: 1em;
}
.greeting .entryBody p.msg br {
    display: none;
}
.greeting .entryBody p.name + p.name {
    margin-bottom: 2em;
}
.greeting .entryBody p.ceoImg img {
    height: auto;
}
}

@media print {
    .greeting {
        border-top: none;
    }
    .greeting #header,
    .greeting #gNav,
    .greeting #mainVisual,
    .greeting #breadCrumbs,
    .greeting #pageTop,
    .greeting #footer {
        display: none;
    }
.greeting .entryBody p {
    line-height: 1.6;
}
.greeting .entryBody p.name {
    margin-top: 1em;
}
}


/* ------ ------ ------ ------ ------ ------ ------ ------
philosophy.html
 ----- ------ ------ ------ ------ ------ ------ ------ */

.philosophy .entryBody h3.green{
	border-left: none;
	margin-bottom: 0px;
	margin-left: 0;
	padding-left: 5px;
	color: #00a13a;
	font-weight: bold;
	font-size: 120%;
}
.philosophy .entryBody h3+p{
	margin-bottom: 30px;
	padding-left: 5px;
}
.philosophy .entryBody h3+p strong{
	display: block;
	margin-bottom: 5px;
}
.phil-image{
    text-align: center;
}
.phil-image-sp {
	display: none;
}
.philosophy span.mp-sp{
	display: none;
}

@media screen and (max-width: 640px) {
	.phil-image{
	    display: none;
	}
	.phil-image-sp {
		display: block;
	}
	.philosophy span.mp-pc{
		display: none;
	}
	.philosophy span.mp-sp{
		display: inline-block;
		margin: 5px 0 10px;
	}
}
/* ------ ------ ------ ------ ------ ------ ------ ------
profile.html
 ----- ------ ------ ------ ------ ------ ------ ------ */


/* ------ ------ ------ ------ ------ ------ ------ ------
organization.html
 ----- ------ ------ ------ ------ ------ ------ ------ */

.btn.plus:after{
	display: none;
}
.btn.plus{
	border-radius:0 0;
	padding-right: 40px;
	background: url(../../img/company/organization/plus.png) no-repeat 90% 50% #fff;
}
.btn.plus:hover{
	background-color: #00A13A;
}



/* ------ ------ ------ ------ ------ ------ ------ ------
customer.html
 ----- ------ ------ ------ ------ ------ ------ ------ */
.clientimg{
	font-size: 0;
	margin-bottom: 30px;
}
.clientimg li{
	width: 126px;
	display: inline-block;
	margin-bottom: 5px;
	text-align: center;
}
.clientimg li.double{
	width: 250px;
}
.clientimg li.double img{
	width: 165px;
	height: auto;
}
.customer-list{
	overflow: hidden;
	padding: 0 10px;
}
.customer-list li{
	/*list-style: disc inside;*/
	padding:0 1em;
	margin-bottom: 7px;
	padding-bottom: 7px;
	border-bottom: 1px dotted #ededed;
}
@media screen and (max-width: 640px) {
	.clientimg{
		text-align: center;
	}
	.clientimg li{
		width: 60px;
	}
	.clientimg li.double{
		width: 120px;
	}
	.clientimg li.double img{
		width: 100%;
	}
}


/* ------ ------ ------ ------ ------ ------ ------ ------
access.html
 ----- ------ ------ ------ ------ ------ ------ ------ */
.access-list li{
	margin-bottom: 20px;
	overflow: hidden;
}
.access-list li figure{
	float: left;
	vertical-align: top;
	margin-right: 20px;
}

table.access{
	float: left;
	width: 570px;
}
table.access th{
	width: 20%;
	background: none;
	font-weight: normal;
}
table.access th.comName{
	background: #f2f2f2;
	font-weight: bold;
}
@media screen and (max-width: 640px) {
	.access-list li{
		margin-bottom: 40px !important;
	}
	.access figure{
		float: none;
		width: 100%;
		display: block !important;
		text-align: center;
		margin: 0 0 10px !important;
	}
	table.access{
		float: none;
		width: 100%;
	}
	table.access th.comName{
		text-align: center;
	}
	table.access tbody{
		width: 100%;
		display: block;
	}
}

/* ------ ------ ------ ------ ------ ------ ------ ------
group.html
 ----- ------ ------ ------ ------ ------ ------ ------ */
.group-list li{
	margin-bottom: 30px;
}
.group-list li figure{
	display: inline-block;
	vertical-align: top;
	margin-right: 20px;
}

.group table{
	display: inline-block;
	width: 425px;
	border: none;
}
.group table th,
.group table td{
	border: none;
	border-bottom: 1px solid #d5d5d5;
	border-top: 1px solid #d5d5d5;
}
.group table th{
	width: 30%;
	text-align: left;
}


@media screen and (max-width: 640px) {
	.group-list li{
		margin-bottom: 40px !important;
	}
	.group figure{
		display: block !important;
		text-align: center;
		margin: 0 0 10px !important;
	}
	.group table{
		width: 100%;
	}
	.group table th{
		width: 40%;
	}
    .group .lettersp {
        font-size: 0.9em;
        letter-spacing: -1px;
    }
}

/* ------ ------ ------ ------ ------ ------ ------ ------
history.html
 ----- ------ ------ ------ ------ ------ ------ ------ */

p.roots{
	padding: 20px 30px !important;
	border: 2px solid #ededed;
}
p.roots span{
	font-size: 120%;
	display: block;
	margin-bottom: 10px;
	font-weight: bold;
	color: #00A13A;
}
.history_nav{
	overflow: hidden;
	margin-bottom: 30px;
}
.history_nav li{
	float: left;
	margin-right: 20px;
}
.btn.history{
	padding: 0 50px 0 20px;
	background: url(/img/company/history/arr_deactive.png) no-repeat 90% 50% #fff;
}
.btn.history:hover{
	background-color: #323232;
	border-color: #323232;
}
.btn.history.active{
	background: url(/img/company/history/arr_active.png) no-repeat 90% 50% #00A13A;
	color: #fff;
	border-color: #00A13A;
}
.btn.history:after{
	display: none;
}
.since{
	position: relative;
}
.since dl.display{
	z-index: 1;
	display: block;
}
.since dl{
	position: absolute;
	width: 100%;
	height: auto;
	display: none;
	z-index: 0;
}
.since dl dt, .since dl dd{
	float: left;
	min-height: 60px;
}
.since dl dt{
	clear:left;
	font-size: 120%;
	font-weight: bold;
	width: 22%;
}
.since dl dd:before{
	position: absolute;
	top: 0;
	left: 0;
	width: 100%;
	height: 100%;
	content: "";
	display: block;
	margin-left: 10px;
	background: url(/img/company/history/point.png) no-repeat left top;
}
.since dl dd{
	position: relative;
	zoom: 1;
	width: 70%;
	padding: 0 0 30px 60px;
	background: url(/img/company/history/border.png) repeat-y 10px -5px;
}


@media screen and (max-width: 640px) {
	.since{
		height: 100% !important;
	}
	.since dl{
		opacity: 1 !important;
		position: static;
		height: auto;
	}
	.since dl dt,
	.since dl dd{
		background: none;
		height: auto;
	}
	.since dl dd:before{
		margin: 0;
		background: url(/img/company/history/point.png) no-repeat left top;
	}
	.since dl dt{
		font-size: 110%;
		width: 32%;
	}
	.since dl dd{
		width: 68%;
		padding-bottom: 30px;
		padding-left: 35px;
		background: url(/img/company/history/border.png) repeat-y left top;
	}
	.history_nav{
		width: 100%;
		display: table;
	}
	.history_nav li{
		float: none;
		margin: 0;
		width: 100px;
		display: table-cell;
		border: 2px solid #00A13A;
		border-right: none;
	}
	.history_nav li:last-child{
		border-right: 2px solid #00A13A;
	}
	.btn.history{
		width: 100%;
		font-size: 12px;
		border-radius: 0px;
		padding: 0 30px 0 5px;
		background-size: 18px;
		border: none;
	}
	.btn.history.active{
		background-size: 18px;
		border: none;
	}

}

/* ------ ------ ------ ------ ------ ------ ------ ------
business.html
 ----- ------ ------ ------ ------ ------ ------ ------ */


/* ------ ------ ------ ------ ------ ------ ------ ------
about
 ----- ------ ------ ------ ------ ------ ------ ------ */
.about #main h2 {
    margin: 20px 0 0 0;
    padding: 0;
    border: none;
    cursor: pointer;
    position: relative;
    overflow: hidden;
}
.about #main h2 span {
    width: 34px;
    height: 34px;
    overflow: hidden;
    position: absolute;
    top: 0;
    right: 0;
}
.about #main h2.open span img {
    margin-top: -34px;
}
.about #main h2 + div {
    display: none;
    margin-bottom: 50px;
    padding: 48px 0 0 0;
    background: url(../../img/company/about/about-bg1.jpg) 100px 0 no-repeat;
}
.about #main h2 + div h3 {
    margin: 0 40px 20px;
    padding: 0;
    border: none;
    color: #00a13a;
    font-size: 1.6em;
    overflow: hidden;
}
.about #main h2 + div h3 + p {
    margin: 0 48px 1em;
    padding: 0;
    font-size: 1.1em;
    line-height: 1.8;
}
.about #main #aboutCon2 #aboutFlow {
    width: 822px;
    margin: 0 auto;
    position: relative;
}
.about #main #aboutCon2 #aboutFlowSP {
    display: none;
}
.about #main #aboutCon2 #aboutFlow p:first-child {
    margin-bottom: 93px;
}
.about #main #aboutCon2 #aboutFlow p:first-child + * {
    margin-bottom: 127px;
}
.about #main #aboutCon2 #aboutFlow ul li {
    position: absolute;
}
.about #main #aboutCon2 #aboutFlow ul li:first-child {
    top: 245px;
    left: 0;
}
.about #main #aboutCon2 #aboutFlow ul li:first-child + * {
    top: 280px;
    left: 270px;
}
.about #main #aboutCon2 #aboutFlow ul li:first-child + * + * {
    top: 280px;
    left: 483px;
}
.about #main #aboutCon2 #aboutFlow ul li:first-child + * + * + * {
    top: 280px;
    left: 602px;
}
.about #main #aboutCon2 #aboutFlow ul li:first-child + * + * + * + * {
    top: 280px;
    left: 720px;
}
.about #main #aboutCon2 #aboutFlow ul li:first-child + * + * + * + * + * {
    top: 592px;
    left: 0;
}
.about #main #aboutCon2 #aboutFlow ul li:first-child + * + * + * + * + * + * {
    top: 602px;
    right: 0;
}

@media print {
    .about #main .entryBody h2.open {
        page-break-before: always;
    }
    .about #main #aboutCon2 #aboutFlow ul li:first-child {
        top: 245px !important;
        left: 0 !important;
    }
    .about #main #aboutCon2 #aboutFlow ul li:first-child + * {
        top: 280px !important;
        left: 270px !important;
    }
    .about #main #aboutCon2 #aboutFlow ul li:first-child + * + * {
        top: 280px !important;
        left: 483px !important;
    }
    .about #main #aboutCon2 #aboutFlow ul li:first-child + * + * + * {
        top: 280px !important;
        left: 602px !important;
    }
    .about #main #aboutCon2 #aboutFlow ul li:first-child + * + * + * + * {
        top: 280px !important;
        left: 720px !important;
    }
    .about #main #aboutCon2 #aboutFlow ul li:first-child + * + * + * + * + * {
        top: 592px !important;
        left: 0 !important;
    }
    .about #main #aboutCon2 #aboutFlow ul li:first-child + * + * + * + * + * + * {
        top: 602px !important;
        right: 0 !important;
    }

}

.about #main #aboutCon3 h4 {
    width: 820px;
    margin: 0 auto 20px;
    padding: 10px 0;
    background: url(../../img/company/about/about3-img1.jpg) 60px center no-repeat #5cc2cf;
    border-radius: 5px;
    color: #fff;
    font-size: 2.1em;
    text-align: center;
}
.about #main #aboutCon3 h4 + div + h4 {
    background: url(../../img/company/about/about3-img2.jpg) 140px center no-repeat #00a13a;
}
.about #main #aboutCon3 h4 + div {
    width: 820px;
    margin: 0 auto 20px;
}
.about #main #aboutCon3 h4 + div dl {
    display: table;
    width: 100%;
    padding: 12px 0;
    border-top: 2px dashed #ccc;
    overflow: hidden;
}
.about #main #aboutCon3 h4 + div dl:first-child {
    border-top: none;
 }
.about #main #aboutCon3 h4 + div dl dt,
.about #main #aboutCon3 h4 + div dl dd {
    display: table-cell;
}
.about #main #aboutCon3 h4 + div dl dt {
    width: 186px;
    padding: 16px 0;
    background-color: #c8e8cf;
    border-radius: 5px;
    font-size: 1.2em;
    font-weight: bold;
    text-align: center;
    vertical-align: middle;
}
.about #main #aboutCon3 h4 + div dl dd {
    padding: 0 0 0 20px;
    font-size: 1.1em;
}
.about #main #aboutCon3 h4 + div dl dd ul {
    margin-left: 20px;
}
.about #main #aboutCon3 h4 + div dl dd ul li {
    list-style: disc;
    line-height: 1.4;
}

.about #side {
    width: 980px;
    margin-bottom: 40px;
    padding: 20px 30px;
    background-color: #ededed;
    overflow: hidden;
}
.about #side h1 {
    display: none;
}
.about #side ul li {
    display: table;
    float: left;
    width: 183px;
    vertical-align: middle;
}
.about #side li a {
    display: table-cell;
    height: 60px;
    border: 2px solid #ededed;
    background: #fff;
    text-align: center;
    vertical-align: middle;
    color: #1b1b1b;
    font-size: 14px;
    font-weight: bold;
    text-decoration: none;
}
.about #side li a:hover {
    background: #00a13a;
    color: #fff;
    -webkit-transition: all 0.2s ease-out;
    -moz-transition: all 0.2s ease-out;
    -o-transition: all 0.2s ease-out;
    transition: all 0.2s ease-out
}
.btn2{
    display: inline-block;
    margin-top: 20px;
    padding: 10px 15px;
    font-weight: bold;
    color: #1b1b1b !important;
}
.btn2:hover{
    opacity: .6;
    -webkit-transition: all 0.2s ease-out;
       -moz-transition: all 0.2s ease-out;
         -o-transition: all 0.2s ease-out;
            transition: all 0.2s ease-out;
}
.arr {
    margin-bottom: 20px;
    padding-right: 35px;
    background: url(../img/arrow2.png) 93% center no-repeat;
}
.grey {
    background-color: #ededed;
    text-decoration: none;
}


@media screen and (max-width: 640px) {
    .about #main .entryBody {
        width: 100%;
    }
    .about #main h2 {
        width: 100%;
        margin: 20px 0 0 0;
        padding: 0;
        border: none;
        overflow: hidden;
    }
    .about #main h2 img {
        width: 100%;
    }
    .about #main h2 span {
        width: 24px;
        height: 24px;
    }
    .about #main h2.open span img {
        margin-top: -24px;
    }
    .about #main h2 + div {
        padding: 28px 10px 0 10px;
        background-position: 30px 0;
    }
    .about #main h2 + div h3 {
        margin: 0 3px 20px;
        font-size: 1.3em;
    }
    .about #main h2 + div h3 + p {
        margin: 0 6px 1em;
        font-size: 1.2em;
    }

    .about #main #aboutCon2 #aboutFlow {
        display: none;
    }
    .about #main #aboutCon2 #aboutFlowSP {
        display: block;
        text-align: center;
    }
    .about #main #aboutCon3 h4 {
        width: 100%;
        padding: 10px 0;
        background: url(../../img/company/about/about3-img1.jpg) 18px center no-repeat #5cc2cf;
        border-radius: 5px;
        font-size: 1.8em;
    }
    .about #main #aboutCon3 h4 + div + h4 {
        background: url(../../img/company/about/about3-img2.jpg) 18px center no-repeat #00a13a;
    }
    .about #main #aboutCon3 h4 + div {
        width: 100%;
    }
    .about #main #aboutCon3 h4 + div dl,
    .about #main #aboutCon3 h4 + div dl dt {
        display: block;
    }
    .about #main #aboutCon3 h4 + div dl dt {
        width: 90%;
        margin: 0 auto 10px;
    }
    .about #side {
        display: none;
    }

} /* @media */

/* 2018 01 WQ Add executive */
	.executivePage .detailWrap {
		margin: 40px 0 0 0;
}
.executivePage .detailWrap .detail {
/* 	padding: 10px; */
/* 	border: 3px solid #00A13A; */
	margin: 0 0 20px 0;
background: #fbfbfb;
	padding: 20px;
	border: 3px solid #f2f2f2;
}

.executivePage .detailWrap .detail th,
.executivePage .detailWrap .detail td {
	padding: 8px 0;
	vertical-align: top;
	line-height: 1.5;
	background: none;
	font-weight: normal;
	font-size: .9em;
}
.executivePage .detailWrap .detail th {
	width: 19%;
	white-space: nowrap;
	padding-right:  10px;
}
.executivePage .detailWrap .detail .photoBox p {
		margin-bottom: 5px;
}
.executivePage .detailWrap .detail p.post {
	font-size: 1.2em;
	line-height: 1.2;
	margin-bottom: 10px;
	font-weight: bold;
}
.executivePage .detailWrap .detail p.name {
	font-size: 1.2em;
	font-weight: bold;
	margin: 5px 0 0 0;
	line-height: 1.2;
}
.executivePage .detailWrap .detail .kana {
	display: inline-block;
	font-size: .7em;
}
.executivePage .detailWrap .detail .birthday {
	display: inline-block;
	font-size: .8em;
}

.executivePage .detailWrap .gotoTop {
	text-align: right;
	margin: 0;
}

.executivePage .detail .gotoTop a {
	display: inline-block;
	font-size: .9em;
	background: #00a13a;
	padding: 5px 15px;
	color: #FFF;
	text-decoration: none;
}

.executivePage .detail .gotoTop a:hover {
	background: #cef8dd;
	color: #00a13a;

}

@media screen and (max-width: 640px) {
	.executivePage .detailWrap .detail th {
		white-space: nowrap;
		padding-right:  10px;
	}
	}