@charset "UTF-8";

main { width: 100%!important;  }

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

/* --------------------------------------------------
	SLIDE
-------------------------------------------------- */
	
div#slide { width: 100%; position: relative; margin-top:100px; }
div#slide div.copy {background: url('../img/index/copy3.png') no-repeat center center / contain;position: absolute;left: 0;top: 0;width: 100%;z-index: 999;}div#slide strong { width: 100%; color: #fff; font-size: 32px; text-align: center; position: absolute; top: 0; z-index: 999; }
div#slide p { margin: 0; padding: 0; width: 100%; text-align: center; position: absolute; z-index: 998; top: 50%;left: 50%;transform: translate(-50%,-50%);height: 100%;padding: 8px 0;box-sizing: border-box; }

/*
div#slide .copy_img {
background: url('../img/index/copy.png') no-repeat center center / contain;
height: 0;
padding-top: 25%;
top: 50%;
left: 50%;
transform: translate(-50%,-50%);
}
*/

div#slide p img { width: auto; height: 100%; }
div#slide ul { margin: 0; padding: 0; list-style: none; }
div#slide li {}
div#slide li img { width: 100%; height: auto; vertical-align: top; }
div#slide strong { position: absolute; z-index: 999; top: 50%; left: 50%; transform: translate(-50%,-50%); }

@media screen and (max-width : 1500px) {
div#slide strong { font-size: 30px; }
}

@media screen and (max-width : 1400px) {
div#slide strong { font-size: 28px; }
}

@media screen and (max-width : 1300px) {
div#slide strong { font-size: 26px; }
}

@media screen and (max-width : 1200px) {
div#slide strong { font-size: 24px; }
}

@media screen and (max-width : 1100px) {
div#slide strong { font-size: 22px; }
}

@media screen and (max-width : 1000px) {
div#slide strong { font-size: 20px; }
}

@media screen and (max-width : 900px) {
div#slide strong { font-size: 18px; }
}

@media screen and (max-width : 800px) {
div#slide strong { font-size: 16px; }
}

@media screen and (max-width : 767px) {
div#slide strong { font-size: 14px; }
div#slide li img { width: 200%; }
}

/* --------------------------------------------------
	CONTENTS
-------------------------------------------------- */

main { padding: 0!important; }

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

/* --------------------------------------------------
	CONTENTS
-------------------------------------------------- */

div#contents { margin: 0 auto; padding: 50px 0 90px 0; width: 1000px; }
.bx-wrapper {box-shadow: none!important;border: none!important;}
section#news { width: 680px; float: left; }
section#news div.title { margin: 0 0 25px 0; line-height: 1; }
section#news div.title h1 { margin: 0; padding: 0 0 0 87px; background: url(../img/common/h1-2.png) 0 center no-repeat; border-left: none; font-size: 38px; font-weight: 400; float: left; }
section#news div.title a { margin: 0.75em 0 0 0; color: #e55a24; font-size: 120%; float: right; }
section#news ul { margin: 0; padding: 0; border-top: solid 1px #a0a0a0; list-style: none; }
section#news li { padding: 15px 12px; border-bottom: solid 1px #a0a0a0; }
section#news li span { color: #e55a24; font-size: 95%; display: block; }
div#banner { width: 280px; float: right; }
div#banner ul { margin: 0; padding: 0; list-style: none; }
div#banner li { margin: 0 0 20px 0; }
div#banner li img { vertical-align: top; }

@media screen and (max-width : 767px) {
div#contents { padding: 25px 0 20px 0; width: auto; }
section#news { width: auto; float: none; }
section#news div.title { margin: 0 10px 10px 10px; }
section#news div.title h1 { padding: 10px 0 10px 64px; background-size: 50px auto; font-size: 180%; }
section#news div.title a { margin: 1em 0 0 0; font-size: 100%; }

div#banner { margin: 35px 0 0 0 !important; width: 100%; float: none; }
div#banner li { margin: 0 0 15px 0; text-align: center; }
div#banner li img { width: 200px; height: auto; }
}

/* --------------------------------------------------
	LINK
-------------------------------------------------- */

div#link { background: #fbdac8; }
div#link div.inner { margin: 0 auto; padding: 50px 0; width: 100%; }
div#link ul { margin: 0 auto; padding: 0; width: 90%; list-style: none; }
/*
div#link li { margin: 0 175px 0 0; width: 330px; float: left; }
*/
div#link li { float:left; width:25%; }
div#link li.company a { background: #eaa6c8 url(../img/index/iconCompany.png) center 32px no-repeat; }
div#link li.service a { background: #e83743 url(../img/index/iconService.png) center 32px no-repeat; }
div#link li.case a { background: #eaa6c8 url(../img/index/iconCase.png) center 32px no-repeat; }
div#link li.facilities a { background: #e83743 url(../img/index/iconFacilities.png) center 32px no-repeat; }
div#link li a{ transition: 0.3s; }
div#link li a:hover{ opacity: 0.5; background-position: center 40px; }
div#link a { width: 200px; height: 200px; border-radius: 100px; color: #fff; text-align: center; line-height: 1; display: block; position: relative; box-shadow: 0 0 5px #ccc; margin: 0 auto;}
div#link strong { width: 100%; font-size: 30px; font-weight: 400; display: block; position: absolute; top: 90px; }
div#link span { width: 100%; font-size: 16px; display: block; position: absolute; top: 140px; }

@media screen and (max-width : 767px) {
div#link div.inner { padding: 25px 0; width: auto; }
div#link ul { width: 310px; }
div#link li { margin: 0 0 20px 0; padding: 0 5px; width: 145px; }
div#link li.quality a { background-position: center 30px; background-size: 30px auto; }
div#link li.environment a { background-position: center 34px; background-size: 30px auto; }
div#link a { width: 145px; height: 145px; }
div#link strong { font-size: 16px; top: 88px; }
div#link span { font-size: 12px; top: 108px; }
}