/* ----------------------- style resset */

* {
	margin: 0;
	padding: 0;
	}
	
body {
	color: #000000;
	font-size:16px ;
	line-height:140% ;
    font-weight: bold;
	font-family:"ヒラギノ丸ゴ Pro W4",ヒラギノ丸ゴ Pro W4, Hiragino Maru Gothic Pro, Osaka, "ＭＳ ゴシック", sans-serif;
	}

img {
	border: none;
	}

hr {
	display: none;
	}

h1, h2, h3, h4, h5, h6, p, address {
	font-size: 100%;
	font-weight: bold; 
	font-style: normal;
}
a:link { 
	color: #000000;
	text-decoration:none;
}
a:visited { 
	color: #000000;
	text-decoration:none;
} 
a:hover {
      color: #000000;
	  text-decoration: none;
}

select, input, textarea {
	font-size:12px ;
	padding: 2px 0px 0px 0px;
}

/* ----------------------- ページトップ */

.banner {
    padding: 1em;
    position: fixed;
    bottom: 0;
    right: 0;
    z-index: 555;
	display: none;
}
.banner img {
  display: block;
  width: 100%;
}

@media screen and (min-width: 751px) {
.banner div {
  width: 175px;
  margin: 0 0 0 auto;
}
#start {
position: absolute;
top:1000px;
left:0;
}
}
@media screen and (max-width : 750px) {
.banner {
width: 25%;
}
.banner div {
  margin: 0 0 0 auto;
}
#start {
position: absolute;
top:200px;
left:0;
}
.is-fixed {
  display: none!important;
}
}

/* ----------------------- header */

#head_wrap {
overflow: hidden;
padding: 5px 0px ;
position: fixed;
left:50%;
transform: translateX(-50%);
background-color: rgba(255,255,255,1.0);
z-index: 100;
width: 100%;
}
.headder {
margin: 0 auto;
}
#head_wrap ul{
display:flex;
-webkit-box-pack:justify;
-ms-flex-pack:justify;
justify-content:space-between;
flex-wrap:wrap;
list-style: none;
width: 80%;
margin: 0 auto;
line-height: 100%;
}
#head_wrap ul li:nth-child(1){
width: 14.39559%;
}
#head_wrap ul li:nth-child(2){
width: 12.69224%;
}
#head_wrap ul li:nth-child(3){
width: 10%;
}
/*#head_wrap ul li:nth-child(3){
width: 7.03296%;
}*/
#head_wrap ul li:nth-child(4){
width: 12.47246%;
}
#head_wrap ul li:nth-child(5){
width: 10.274%;
}
#head_wrap ul li:nth-child(6){
width: 6.15384%;
}
#head_wrap ul li:nth-child(7){
width: 11.15378%;
}
#head_wrap ul li.logo{
margin-right: 50px;
}
#head_wrap ul li img{
width: 100%;
}

/* ----------------------- footter */

.foot-logo{
text-align: center;
margin-top: 50px
}
.foot-logo-tx{
text-align: center;
margin-top: 50px;
font-size: 60%;
color: #c2c2c2;
}
.foot-logo img{
width: 10.8472%;
}

#footer{
background-color:#00a0e9 ;
}

.foot-navi{
width:33.85%;
margin: 15px auto 0;
display:flex;
-webkit-box-pack:justify;
-ms-flex-pack:justify;
justify-content:space-between;
flex-wrap:wrap;
padding: 30px 0;
}
.foot-navi ul{
list-style:none;
}
.foot-navi a:link,
.foot-navi a:visited{
color: #fff
}
.foot-sns{
width:14%;
}
.foot-sns img{
width:100%;
margin-bottom: 20px;
}

.foot-links li{
margin-bottom: 5px;
}

.foot-btns li{
margin-bottom: 20px;
border:2px solid #fff ;
border-radius: 30px;
text-align: center;
padding: 10px;
}

#footer .foot_btm{
font-size:60% ; 
text-align:center ;
color:#FFFFFF ; 
padding: 0 0 20px;
margin-bottom: 0px;
line-height: 130%;
}


@media screen and (min-width: 751px) {

.for_sp{
	display: none;
}
#container { 
	margin: 0 auto;
	width:100%;
}
.content { 
	margin: 0 auto;
    width:100%;
	max-width:1500px;
	position:relative;
}
.under-content{
  padding-top: 70px;
}
.space {
  margin-top:-85px;
  padding-top:85px;
}

a:hover img {
opacity: 0.7;
filter: alpha(opacity=70);
}

.headder {
max-width:1500px;
}
}

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

img {
width: 100%;
height: auto;
border: none;
}
.for_pc{
	display: none;
}

#container { 
	text-align:left;
	margin: 0 auto;
	width:100%;
}
.content { 
	margin: 0 auto;
	width:97%;
	position:relative;
}
.under-content{
  padding-top: 66px;
}
.under-content.top-page{
  padding-top: 55px;
}
.space {
   margin-top:-45px;
  padding-top:45px;
}

#head_wrap {
padding: 5px 0px 0;
width: 100%;
}
.headder{
width: 100%;
}
.headder ul{
width: 98%;
}
#head_wrap ul{
width: 96%;
}
#head_wrap ul li.logo{
margin-right: 5px;
}
#head_wrap ul li:nth-child(1){
width: 100%;
text-align: center;
}
#head_wrap ul li:nth-child(1) img{
width: 18%;
}
#head_wrap ul li:nth-child(2){
width: 16.8185%;
}
#head_wrap ul li:nth-child(3){
width: 12.8%;
}
/*#head_wrap ul li:nth-child(3){
width: 9.2811%;
}  */
#head_wrap ul li:nth-child(4){
width: 16.54%;
}
#head_wrap ul li:nth-child(5){
width: 13.5735%;
}
#head_wrap ul li:nth-child(6){
width: 8.1714%;
}
#head_wrap ul li:nth-child(7){
width: 14.7564%;
}

#footer{
font-weight: bold;
}
.foot-logo{
margin-top: 30px
}
.foot-logo-tx{
margin-top: 30px;
font-size: 40%;
color: #c2c2c2;
}
.foot-logo img{
width: 21.6%;
}

.foot-navi{
width:96%;
margin: 15px auto 0;
display:flex;
-webkit-box-pack:justify;
-ms-flex-pack:justify;
justify-content:space-between;
flex-wrap:wrap;
padding: 30px 0;
}

.foot-sns{
width:14%;
}

.foot-links ul{
margin-top: 5px
}
.foot-links li{
font-size: 80%;
line-height: 145%;
}

.foot-btns li{
font-size: 80%;
    margin-bottom: 20px;
    border: 2px solid #fff;
    border-radius: 30px;
    text-align: center;
    padding: 5px;
}
#footer .foot_btm{
font-size:40% ; 
}
}

/* ----------------------- top-page */

.top-main {
width: 100%;
background: url("../img/top/top_01_craft_02.jpg") no-repeat left center;
background-size: cover ;
}

/* news */

.news {
width: 100%;
background: url("../img/top/top_movie_02-bg.png") repeat-x left center;
background-size: auto 100%;
text-align: center;
position: relative;
}
.news .content{
padding-bottom: 80px;
}
img.gao {
position: absolute;
bottom:0;
left:0;
width: 90%;
}
img.news-bg {
width: 60%;
padding-top: 20px;
}
.news ul {
list-style: none;
font-size: 100%;
position: absolute;
top:32%;
left:35%;
line-height: 180%;
z-index: 10;
}


/* 会社紹介 */

.top-about{
text-align: center;
margin-top: 50px;
}
.top-about-link{
text-align: center;
margin-top: 30px;
}
.top-about-link img {
width: 16%;
}

@media screen and (max-width : 750px) {
.top-main {
width: 100%;
background: url("../img/top/top_01_smartphone_craft_02.png") no-repeat left center;
background-size: 100% auto ;
}
.news {
width: 100%;
background: url("../img/top/top_movie_02-bg-sp.png") no-repeat left bottom,#d1fffa;
background-size: 100% auto;
text-align: center;
position: relative;
}
.news .content{
padding-bottom: 30px;
overflow: hidden;
}
img.news-bg {
width: 78%;
padding-top: 0;
padding-bottom: 10px;
}
img.gao {
position: absolute;
bottom:0;
left:0;
width: 100%;
}
.news ul {
list-style: none;
position: absolute;
top:25%;
left: 50%;
transform: translateX(-50%);
z-index: 10;
width: 100%;
}
.news ul li{
font-size: 45%;
line-height: 180%;
}

.top-about{
text-align: center;
margin-top: 30px;
}
.top-about p{
font-size: 80%;
}
.top-about-link img {
width: 32%;
}
}

/* ----------------------- 下層ページ */

.page-title {
width: 100%;
margin: 20px auto 40px;
text-align: center;
}
.page-title img{
width: 47.5%;
}

@media screen and (max-width : 750px) {
.page-title {
width: 100%;
margin: 0 auto 10px;
text-align: center;
}
.page-title img{
width: 68.85%;
}
}

/* ----------------------- OEM */

.oem-top {
width: 100%;
background-color: #c8ffbe;
}
.sub-title {
width: 100%;
margin: 0 auto 40px;
text-align: center;
}
.sub-title img{
width: 22.5%;
}
.flow {
width: 100%;
background: url("../img/oem/bg01.png") repeat-x left bottom,#c8ffbe;
padding-bottom: 120px;
}
.number {
width: 100%;
background: url("../img/oem/bg02.png") repeat-x left bottom,#fdff73;
padding:30px 0 120px;
}
.flow .content,
.number .content{
text-align: center;
}
.flow p,
.number p{
font-size: 180%;
line-height: 160%;
margin-bottom: 50px;
}
img.sub-cont{
width: 67.5%;
}
@media screen and (min-width: 751px) {
.sub-title.minus {
width: 100%;
margin: -20px auto 40px;
text-align: center;
}
}
@media screen and (max-width : 750px) {
.sub-title img{
width: 35%;
}
.sub-title {
width: 100%;
margin: 0 auto 15px;
text-align: center;
}
.flow p,
.number p{
font-size: 70%;
line-height: 140%;
margin-bottom: 10px;
}
.flow {
width: 100%;
background: url("../img/oem/bg01.png") no-repeat left bottom,#c8ffbe;
background-size: 100% auto;
padding-bottom: 30px;
}
.number {
width: 100%;
background: url("../img/oem/bg02.png") no-repeat left bottom,#fdff73;
background-size: 100% auto;
padding:10px 0 30px;
}
img.sub-cont{
width: 95%;
}
}


/* ----------------------- 会社概要 */

.company-main {
width: 100%;
position: relative;
}
.company-main img{
width: 100%;
}
.company-main div{
width: 100%;
z-index: 1;
position: absolute;
top: 0;
left: 0;
}

@media screen and (max-width : 750px) {
.company-main {
overflow: hidden;
}
.company-main div img{
width: 170%;
transform: translateX(-21%);
}
}

.company-cont01 {
width: 100%;
background: url("../img/company/bg01b.png") repeat-x left bottom,url("../img/company/bg01.png") repeat-x left top;
background-size: 100% auto,auto 100%;
padding: 80px 0 150px;
}

.item01{
position: absolute;
width: 45%;
bottom:-20%;
right:-5%;
}

.sdjiak {
width: 46.325%;
margin: 0 auto;
padding: 50px 0 80px;
background: url(../img/company/bg-a.png) left top no-repeat,
url(../img/company/bg-c.png) left bottom no-repeat,
url(../img/company/bg-b.png) left top repeat-y;
background-size: 100% auto ;
position: relative;
}

.sdjiak .sub-title img {
    width: 50%;
}
.sdjiak p {
   text-align: center;
   font-size: 145%;
}
.sdjiak p span{
  margin: 0 auto 10px;
  width: 90%;
  display: block;
  background: url(../img/company/border.png) repeat-x 100% 100%;
  padding-bottom: 15px;
}


.company-cont02 {
width: 100%;
background: url("../img/company/bg02b.png") repeat-x left bottom,url("../img/company/bg02.png") repeat-x left top;
background-size: 100% auto,auto 100%;
padding: 80px 0 150px;
}

.jdghsaikl {
width: 46.325%;
margin: 0 auto;
padding: 30px 0 15px;
background-color:#FFFFFF ;
border-radius: 30px;
position: relative;
}

.item03{
position: absolute;
width: 30%;
top:-20%;
left:-5%;
}
.item04{
position: absolute;
width: 30%;
top:28%;
right:1%;
}
.item05{
position: absolute;
width: 20%;
bottom:-5%;
right:-3%;
}
.item06{
position: absolute;
width: 80%;
bottom:-17%;
left:-5%;
}

.company-cont02 .sub-title img {
    width: 25%;
}

.jdghsaikl dl{
width: 95%;
margin: 0 auto;
display:flex;
-webkit-box-pack:justify;
-ms-flex-pack:justify;
justify-content:space-between;
flex-wrap:wrap;
}
.jdghsaikl dl dt{
width: 25%;
margin-bottom: 15px;
}
.jdghsaikl dl dd{
width: 73%;
margin-bottom: 15px;
}

.company-cont03 {
width: 100%;
background: url("../img/company/bg03.png") repeat-x left top;
background-size: auto 100% ;
padding: 80px 0 20px;
}
.company-cont03 .content{
text-align: center;
}
.company-cont03 .content img.imgChange2{
width: 90%;
padding: 20px 0;
}
.company-cont03 .content p{
font-size: 180%;
line-height: 160%;
}
.company-cont03 .content p.info{
font-size: 150%;
}

@media screen and (max-width : 750px) {
.company-cont01 {
width: 100%;
background: url("../img/company/bg01b.png") repeat-x left bottom,url("../img/company/bg01-sp.png") repeat-y left top;
background-size: 200% auto,100% auto;
padding: 30px 0 50px;
}

.item01{
position: absolute;
width: 45%;
bottom:-10%;
right:-5%;
}

.sdjiak {
width: 85%;
margin: 0 auto;
padding: 30px 0 50px;
background: url(../img/company/bg-a.png) left top no-repeat,
url(../img/company/bg-c.png) left bottom no-repeat,
url(../img/company/bg-b.png) left top repeat-y;
background-size: 100% auto ;
position: relative;
}

.sdjiak .sub-title img {
    width: 60%;
}
.sdjiak p {
   text-align: center;
   font-size: 75%;
}
.sdjiak p span{
  margin: 0 auto 5px;
  width: 97%;
  display: block;
  background: url(../img/company/border.png) repeat-x 100% 100%;
  background-size: 3% auto;
  padding-bottom: 5px;
  font-weight: bold;
}

.company-cont02 {
width: 100%;
background: url("../img/company/bg02b.png") repeat-x left bottom,url("../img/company/bg02-sp.png") repeat-y left top;
background-size: 200% auto,100% auto;
padding: 40px 0 80px;
}
.jdghsaikl {
width: 85%;
margin: 0 auto;
padding: 30px 0 15px;
background-color:#FFFFFF ;
border-radius: 30px;
position: relative;
}

.company-cont02 .sub-title img {
    width: 55%;
}
.jdghsaikl dl{
font-size: 55%;
line-height: 130%;
transform: translateX(1%);
}
.jdghsaikl dl dt{
width: 25%;
margin-bottom: 10px;
}
.jdghsaikl dl dd{
width: 73%;
margin-bottom: 10px;
}
.item03{
position: absolute;
width: 30%;
top:-18%;
left:0%;
}
.item04{
position: absolute;
width: 30%;
top:30%;
right:-8%;
}
.item05{
position: absolute;
width: 20%;
bottom:-10%;
right:-3%;
}
.item06{
position: absolute;
width: 80%;
bottom:-15%;
left:-5%;
}

.company-cont03 {
width: 100%;
background: url("../img/company/bg03-sp.jpg") repeat-y left top;
background-size: 100% auto ;
padding: 20px 0 10px;
}
.company-cont03 .content{
width: 100%;
}
.company-cont03 .content p{
font-size: 70%;
line-height: 140%;
}
.company-cont03 .content p.info{
font-size: 60%;
}
.company-cont03 .content img.imgChange2{
width: 100%;
padding: 20px 0;
}

}


/* ----------------------- 採用 */

.recruit-wrap{
background: url(../img/recruit/bg01.png) repeat left top;
}
.rec-cont01{
transform: translateY(-7%);
}
.katuyaku{
margin: 30px 0 -17% 0
}
.katuyaku02{
margin: 50px 0
}
.recruit-wrap02{
background: url(../img/recruit/bg02.png) repeat left top;
}
.recruit-wrap03{
background: url(../img/recruit/bg03.png) repeat left top;
text-align: center;
padding-bottom: 50px;
}
.sub-t{
margin: 30px 0;
}
.sub-t img{
width: 50%;
}
.recpng{
margin: 30px 0;
}
.recpng img{
width: 65%;
}
.recruit-wrap03 p{
font-size: 180%;
line-height: 160%;
}

.recruit-wrap04{
width: 50%;
margin: 50px auto;
}
.recruit-wrap04 .sub-t{
margin: 0 auto 50px;
text-align: center;
}
.recruit-wrap04 .sub-t img{
width: 100%;
}
.recruit-wrap04 p{
font-size: 150%;
line-height: 150%;
margin-bottom: 80px;
}

/* FAQアコーディオン */

.oubo01 { 
margin: 50px auto 20px;
text-align: center;
}
.oubo01 h2 { 
text-align: center;
font-size: 180%;
  position: relative;
  display: inline-block;
  padding: 0 110px;
  line-height: 130%;
}
.oubo01 h2:before, .oubo01 h2:after {
  content: '';
  position: absolute;
  top: 50%;
  display: inline-block;
  width: 80px;
  height: 1px;
  background-color: black;
}
.oubo01 h2:before {
  left:0;
}
.oubo01 h2:after {
  right: 0;
}
.oubo02 { 
margin: 0 auto 20px;
}
.oubo02 h3 { 
text-align: center;
font-size: 110%;
}

.accordion-wrap {
    margin-bottom: 120px;
}
.recruit-wrap05 dl {
	color:#000;
    margin-bottom: 20px;
}
.recruit-wrap05 dt.accordion{
    width: 40%;
	cursor: pointer;
    background-color: #fff;
    border:1px solid #000 ;
    border-radius: 40px;
    padding: 25px;
    font-size: 180%;
    margin: 0px auto;
    box-sizing: border-box;
}
.recruit-wrap05 dt.accordion div {
position: relative;
}
.recruit-wrap05 dt.accordion p {
margin-left: 30px;
}
.recruit-wrap05 dt.accordion i {
position: absolute;
top: 50%;
transform: translateY(-50%);
font-size: 200%;
}

.recruit-wrap05 dd {
    width: 45%;
    padding: 25px 25px 0 25px;
    font-size: 115%;
    box-sizing: border-box;
    margin: 0 auto;
    }
.recruit-wrap05 dd .close {
	padding:10px;
	cursor: pointer;
    text-align: center;
}
.recruit-wrap05 dd .close img{
	width: 15%;
}

.accordion-wrap table{
width: 100%;
font-size: 90%;
}
.accordion-wrap table th{
width: 30%;
border-width:0px 1px 1px 0px ;
border-style:solid ; 
border-color:#333 ;
padding: 10px;
box-sizing: border-box;
vertical-align: middle;
}
.accordion-wrap table td{
width: 70%;
border-width:0px 0px 1px 0px ;
border-style:solid ; 
border-color:#333 ;
padding: 10px;
box-sizing: border-box;
}

.accordion-wrap table{
border-top:1px solid #333 ;
}

@media screen and (max-width : 750px) {
.under-content.rec .content{
width: 100%;
}
.rec-cont01{
transform: translateY(-7%);
}
.katuyaku{
margin: 30px 0 -8% 0
}
.katuyaku02{
margin: 25px 0
}
.recruit-wrap03{
background: url(../img/recruit/bg03.png) repeat left top;
text-align: center;
padding-bottom: 30px;
}
.sub-t{
margin: 15px 0;
}
.recpng{
margin: 15px 0;
}
.recruit-wrap03 p{
font-size: 70%;
line-height: 140%;
}

.recruit-wrap04{
width: 80%;
margin: 25px auto;
}
.recruit-wrap04 .sub-t{
margin: 0 auto 25px;
text-align: center;
}
.recruit-wrap04 .sub-t img{
width: 100%;
}
.recruit-wrap04 p{
font-size: 60%;
line-height: 140%;
margin-bottom: 40px;
}
/* FAQアコーディオン */

.oubo01 { 
margin: 20px auto 10px;
text-align: center;
}
.oubo01 h2 { 
text-align: center;
font-size: 100%;
  position: relative;
  display: inline-block;
  padding: 0 80px;
  line-height: 130%;
}
.oubo01 h2:before, .oubo01 h2:after {
  content: '';
  position: absolute;
  top: 50%;
  display: inline-block;
  width: 70px;
  height: 1px;
  background-color: black;
}
.oubo02 { 
margin: 0 auto 10px;
}
.oubo02 h3 { 
text-align: center;
font-size: 90%;
}

.accordion-wrap {
    margin-bottom: 50px;
}
.recruit-wrap05 dl {
	color:#000;
    margin-bottom: 10px;
}
.recruit-wrap05 dt.accordion{
    width: 90%;
	cursor: pointer;
    background-color: #fff;
    border:1px solid #000 ;
    border-radius: 30px;
    padding: 10px;
    font-size: 100%;
    margin: 0px auto;
    box-sizing: border-box;
}
.recruit-wrap05 dt.accordion p {
margin-left: 15px;
}
.recruit-wrap05 dt.accordion i {
position: absolute;
top: 50%;
transform: translateY(-50%);
font-size: 200%;
}

.recruit-wrap05 dd {
    width: 95%;
    padding: 15px 15px 0 15px;
    font-size: 115%;
    box-sizing: border-box;
    margin: 0 auto;
    font-size: 75%;
    }
.recruit-wrap05 dd .close {
	padding:10px;
	cursor: pointer;
    text-align: center;
}
.recruit-wrap05 dd .close img{
	width: 20%;
}

.accordion-wrap table{
width: 100%;
font-size: 75%;
}
.accordion-wrap table th{
width: 30%;
padding: 5px;
line-height: 130%;
}
.accordion-wrap table td{
width: 70%;
padding: 5px;
line-height: 130%;
}
}


/* ----------------------- プロダクト */

.product-wrap{
background: url(../img/recruit/bg01.png) repeat left top;
}
.pro-cont01 {
display:flex;
-webkit-box-pack:justify;
-ms-flex-pack:justify;
justify-content:space-between;
flex-wrap:wrap;
width: 45%;
margin: 0 auto;
padding: 70px 0;
}
.pro-cont01 a{
width: 47%;
}
.pro-cont01 a img{
width: 100%;
}

.product-main {
width: 100%;
position: relative;
background: url("../img/product/bg-a.png") repeat-y left top;
background-size: 100% auto;
}
.product-main02 {
width: 100%;
position: relative;
background: url("../img/product/bg-b.png") repeat-y left top;
background-size: 100% auto;
}
.product-main img,
.product-main02 img{
width: 100%;
}
.product-cont01 {
width: 100%;
background: url("../img/product/bg01.png") repeat-x left top;
background-size: auto 100%;
padding-bottom: 30px;
}
.product-cont02 {
width: 100%;
background: url("../img/product/bg02.png") repeat-x left top;
background-size: auto 100%;
padding-bottom: 300px;
}

.items {
width: 50%;
margin: 0 auto;
background: url(../img/product/bg-riku.png) left top no-repeat;
background-size: 100% ;
position: relative;
}
.items-inner {
width: 80%;
margin: 0 auto;
display:flex;
-webkit-box-pack:justify;
-ms-flex-pack:justify;
justify-content:space-between;
flex-wrap:wrap;
}
.items-inner div{
width: 27%;
}
.items-inner div img{
width: 100%;
}
.items-inner div p{
font-size: 90%;
line-height: 140%;
margin: 20px 0;
text-align: center;
}

.items02 {
width: 50%;
margin: 0 auto;
background: url(../img/product/bg-umi.png) left top no-repeat;
background-size: 100% ;
position: relative;
}
.items02 .items-inner{
padding:80px 0;
}
.items02 .items-inner div{
width: 45%;
}

.modal{
    display: none;
    height: 100vh;
    position: fixed;
    top: 0;
    width: 100%;
    z-index: 999;
}
.modal__bg{
    background: rgba(255,255,255,0.75);
    height: 100vh;
    position: absolute;
    width: 100%; 
}
.modal__content{
    left: 50%;
    position: absolute;
    top: 50%;
    transform: translate(-50%,-50%);
    width: 20%;
    text-align: center;
}
img.pop-item{
    width: 100%;
}
.js-modal-close img{
    width: 50px;
    padding-top: 10px;
}

@media (min-width:751px) and (max-width:1420px) { 
.items {
width: 50%;
margin: 0 auto;
background: url(../img/product/bg-riku.png) left top no-repeat;
background-size: cover ;
position: relative;
}
}
@media (min-width:751px) and (max-width:1080px) { 
.items02{
width: 50%;
margin: 0 auto;
background: url(../img/product/bg-umi.png) left top no-repeat;
background-size: cover ;
position: relative;
}
}

@media screen and (max-width : 750px) {
.product-wrap{
background: url(../img/recruit/bg01.png) repeat-y left top;
background-size: 100% auto;
}
.pro-cont01 {
width: 80%;
margin: 0 auto;
padding: 30px 0;
}
.product-main {
width: 100%;
position: relative;
background: url("../img/product/bg-a-sp.png") repeat-y left top;
background-size: 100% auto;
}
.product-main02 {
width: 100%;
position: relative;
background: url("../img/product/bg-b-sp.png") repeat-y left top;
background-size: 100% auto;
}
.product-main,
.product-main02{
overflow: hidden;
}
.product-main img,
.product-main02 img{
width: 140%;
transform: translateX(-16%);
}
.product-cont01 {
width: 100%;
background: url("../img/product/bg01-sp.png") no-repeat left top;
background-size: 100% auto;
padding-bottom: 40px;
}
.product-cont02 {
width: 100%;
background: url("../img/product/bg02-sp.png") no-repeat left top;
background-size: 100% auto;
}
.product-cont02 .content{
padding-top: 90px;
}
.items {
width: 85%;
margin: 0 auto;
background: url(../img/product/bg-riku.png) left top no-repeat;
background-size: 100% ;
position: relative;
padding-bottom: 100px;
}
.items-inner {
width: 75%;
}
.items-inner div{
width: 28%;
}
.items-inner div p{
font-size: 40%;
line-height: 130%;
margin: 5px 0 6px;
text-align: center;
}

.items02 {
width: 85%;
margin: 0 auto;
background: url(../img/product/bg-umi.png) left top no-repeat;
background-size: 100% ;
position: relative;
padding-bottom: 50px;
}
.items02 .items-inner{
padding:30px 0;
}
.items02 .items-inner div{
width: 47%;
}

.modal__content{
    left: 50%;
    position: absolute;
    top: 50%;
    transform: translate(-50%,-50%);
    width: 72%;
    text-align: center;
}
.js-modal-close img{
    width: 25px;
    padding-top: 10px;
}
}


/* 微調整
------------------------------*/
@media (min-width:751px) and (max-width:1000px) { 
.news .content {
    overflow: hidden;
}
img.news-bg {
        width: 78%;
        padding-top: 0;
        padding-bottom: 10px;
        transform: translateY(-15%);
}
img.gao {
z-index: 10;
}
    .news ul {
        list-style: none;
        position: absolute;
        top: 25%;
        left: 50%;
        transform: translateX(-50%);
        z-index: 10;
        width: 100%;
    }

.sdjiak {
        width: 80%;
    }
.jdghsaikl {
        width: 80%;
    }
}

@media (min-width:1001px) and (max-width:1200px) { 
.sdjiak {
        width: 60%;
    }
.jdghsaikl {
        width: 60%;
    }
}

@media (min-width:751px) and (max-width:930px) { 
.recruit-wrap05 dt.accordion {
    width: 60%;
}
}

@media (min-width:751px) and (max-width:1300px) { 
.foot-navi{
width:60%;
margin: 15px auto 0;
display:flex;
-webkit-box-pack:justify;
-ms-flex-pack:justify;
justify-content:space-between;
flex-wrap:wrap;
padding: 30px 0;
}
.foot-sns img{
    max-width: 100px;
    display: block;
}
}