@charset "UTF-8";
/* CSS Document */

.main {
  background-color: #fff7eb;
}
@media(min-width:480px) {
  .main {
    padding-bottom: 180px;
  }
  .about-titlesp{
  display: none;
  }
}

@media(max-width:480px) {
    .main{
      padding-bottom: 80px;
  }
}

/*  ABOUTMEーーーーーーーーーーーーーーーーーー */

#aboutme{
  padding:40px 0;
  z-index: 80;
}
.section-aboutme h2 {
  margin-bottom: 40px;
  text-align: center;
  font-family: 'Oswald', sans-serif;
}
.section-aboutme h3 {
  font-size: 20px;
  font-weight: bold;
  margin:0 0 40px 0;
}
.section-aboutme__picture {
  object-fit: cover;
  object-position: 0 0;
}
.section-aboutme__title p{
  letter-spacing: 0.075rem;
   font-family: "Arial",'Noto Sans JP', sans-serif;
  font-weight: 400;
}
.section-about {
  margin-bottom: 100px;
  text-align: left;
}
  .section-about-bg1{
    width: 28vw;
    height: 41vw;
    position: absolute;
    left: 0;
    z-index: 0;
    content: "";
    background-color: #f9b568;
    top:100px;
  }
  #future{
  max-width: 1040px;
}
.section-about h3 {
  font-size: 20px;
  font-weight: bold;
  margin:0 0 20px 0;
  letter-spacing: 0.2rem;
  font-family: "Noto Sans JP", sans-serif;
}
  .section-about__description {
  font-size:1.4rem;
  letter-spacing: 0.075rem;
    font-family: "Arial",'Noto Sans JP', sans-serif;
    font-weight: 600;
    line-height: 2.1rem;
}

@media(min-width: 1040px) {
    .section-about {
  position:relative;
  text-align: left;
  width: 100%;
  margin: 0 auto;
  height: 1000px;
  max-width: 1240px;
  top:200px;
  }
 .section-aboutme h2 {
  margin:40px 0;
  text-align: center;
  font-family: 'Oswald', sans-serif;
  font-size:12rem;
   line-height:10rem;
   z-index: 80;
}
  .section-aboutme {
  max-width: 1240px;
  margin-bottom: 80px;
  margin: 0 auto;
  position:relative;
          text-align: left;
      height:1070px;
  }
    .section-aboutme h3 {
  font-size: 32px;
      line-height: 52px;
  font-family: "Noto Sans JP", sans-serif;
}
  .section-aboutme__description {
  font-size:1.8rem;
    line-height: 4.0rem;
    margin-bottom: 40px;
  }

  .section-aboutme__picture {
  object-fit: cover;
  object-position: 0 0;
  position:absolute;
    z-index: 100;
    top:275px;
    left: 0px;
}
  .section-aboutme__bg {
  position:absolute;
    z-index: 50;
    left: 260px;
    top:130px;
}
  .section-aboutme__title {
  margin-top:560px;
  position:absolute;
  left:670px;
    z-index: 80;
    max-width:570px;
    font-size: 1.8rem;
    line-height: 4.0rem;
    font-family: "Arial",'Noto Sans JP', sans-serif;
}
  .careersp{
    display: none;
  }
  .aboutmetitle{
    display: none;
  }
  .path1{
    display: none;
  }
  .path2{
    display: none;
  }
  .aboutmetitlepc{
    display: none;
  }
  .aboutmepc{
    display: none;
  }
  .section-about__title{
      position: absolute;
      left:620px;
      top:0;
      }
  .section-aboutme__title {
  left:500px;
  position: absolute;
}
  .section-about__picture {
  object-fit: cover;
  object-position: 0 0;
  position: relative;
  z-index: 100;
  top:0px;
  left: 150px;
}
   .section-about h3 {
  font-size: 34px;
  line-height: 51px;
  font-family: "Noto Sans JP", sans-serif;
  letter-spacing: 0.4rem;
  padding-top: 40px;
}
  .section-about__description {
  font-size:1.8rem;
    line-height: 3.2rem;
    margin-bottom: 40px;
    letter-spacing: 0.15rem;
  width: 100%;
  }
    .section-about-bg1{
    max-height: 590px;
  }
}

@media (max-width:800px) {
  .aboutmetitle{
    margin-top: 90px;
  }
}
@media(max-width: 1040px) {
  .section-aboutme__picture{
    margin: 60px auto;
    height:500px;
    width: 84%;
    z-index: 80;
    position: relative;
}
    .aboutmesp{
    position: absolute;
    top:700px;
    width: 55%;
    z-index: 20;
    left:-20px;
  }
      .aboutmepc{
    position: absolute;
    top:760px;
    width: 55%;
    z-index: 20;
    left:-30px;
  }
    .path1{
    margin-top:-90px;
      width: 100%;
  }
  .path2{
    margin-top:-80px;
    width: 100%;
  }
    .section-aboutme__bg{
    display:none;
  }
    .section-aboutme__title{
      margin: 170px 8%;
    z-index: 130;
    position: absolute;
    text-align: left;
  }
    .section-aboutme{
    height:1450px;
  }
  .aboutmetitlepc{
    padding-top:150px;
  }
    .section-aboutme__title p{
    font-size: 1.8rem;
    line-height: 4rem;
  }
  .section-about__picture{
  width: 75%;
}
 .section-about{
  padding-top: 140px;
 }
   .section-about-bg1{
  position: absolute;
  z-index: 0;
  top:280px;
  width: 70vw;
  height: 90vw;
}
.section-about__title{
  padding:180px 80px 0;
}
  .section-about__description {
  font-size:1.6em;
    line-height: 4.0rem;
}
}


@media(max-width: 480px) {
  .section-aboutme {
  height: 830px;
  margin-bottom:20px;
}
    .section-aboutme__picture{
    z-index: 80;
    height: 240px;
  }
      .aboutmesp{
    position: absolute;
    top:345px;
  }
    .section-aboutme__title p{
    font-size: 1.4rem;
    line-height: 2.4rem;
  }
    .section-aboutme__picture{
    margin:25px auto 30px;
}
      .section-aboutme__title{
      margin:60px 8%;
  }
    .about-title{
  display: none;
  }
.section-about{
  padding-top: 100px;
  margin-bottom: 80px;
}
.section-about h3{
  margin-top: 20px;
}
  .section-about__picture{
  width: 80%;
}
.section-about-bg1{
  position: absolute;
  z-index: 0;
  top:230px;
  width: 70vw;
  height: 85vw;
}
.section-about__title{
  padding:80px 20px 0;
}
  .section-about__description {
  font-size:1.4rem;
  letter-spacing: 0.075rem;
    font-family: "Arial",'Noto Sans JP', sans-serif;
    font-weight: 800;
    line-height: 2.1rem;
}
}

@media(max-width: 600px) {
  .aboutmetitlepc{
    display: none;
  }
  .aboutmepc{
    display: none;
  }
}
@media(min-width: 600px) {
  .aboutmetitle{
    display: none;
  }
    .aboutmesp{
    display:none;
  }
}


/* CAREERーーーーーーーーーーーーーーーーーーーー */
.careers{
  position:absolute;
  z-index: 100;
}
.careertitle{
  margin-bottom: 140px;
}
.year p{
  color:#ff8929;
}
.future p{
  color:#ff8929;
}
.year{
    font-family: "Arial","sans-serif";
  font-weight: bold;
}
#sectioncareercontent ul li{
  list-style: none;
  display:flex;
}
.logobg_pc{
  position: absolute;
  left:440px;
  top:40px;
  z-index: 50;
}
   .careercontent h2{
  font-family: "Noto Sans JP", sans-serif;
}
  .careercontent p{
  font-family: "Arial",'Noto Sans JP', sans-serif;
  font-weight: 600;
  letter-spacing: 0.075rem;
}
  .future{
  font-family: "Arial","sans-serif";
  font-weight: bold;
}
.no{
  font-family: 'Oswald', sans-serif;
    color:#ff8929;
}

@media(max-width: 1040px) {
.section-career{
  margin: 0 auto;
  position: relative;
  height: 2020px;
}
  .careertitle{
    display:none;
  }
  .careersp{
    margin: 60px auto 100px;
    text-align: center;
  }
  .logobg_pc{
    display: none;
  }
  .line{
  position:absolute;
  left:110px;
  top:230px;
  height:1300px;
}
  .careercontent{
  padding:0 6% 35px 13px;
}
   .careercontent h2{
  padding-bottom: 15px;
  font-size: 1.6rem;
     letter-spacing: -0.05rem;
}
  #sectioncareercontent{
        max-width: 84%;
        margin: 0 auto;
        position: relative;
  }
  .careers{
    text-align: left;
    top:300px;
  }
  .careercontent p{
  line-height: 2.4rem;
  font-size: 1.4rem;
}
    .year{
  font-size: 2.4rem;
  padding-right: 30px;
      padding-top: 10px;
}
  .circle{
    padding-top:10px;
  }
      .future{
  font-size: 2.0rem;
  padding-right:20px;
        padding-top: 10px;
}
    #future{
    text-align: right;
    padding-right: 80px;
    position: relative;
    z-index: 100;
}
   .section-about h3 {
  font-size: 42px;
        text-align: left;
        line-height: 50px;
        margin-bottom: 30px;
        margin-top: 40px;
}
}

@media(min-width:600px) {
  .careersp{
    height:140px
  }
    .careercontent h2{
  font-size: 3.4rem;
      line-height: 4.2rem;
  font-family: "Noto Sans JP", sans-serif;
}
    .careercontent p{
  padding-bottom:20px;
  line-height: 2.7rem;
  font-size: 1.8rem;
}
      .careercontent h2 br{
  display: none;
}
}


@media(min-width: 1040px) {
  .section-career{
  max-width: 1240px;
  text-align: left;
  margin: 0 auto;
  position: relative;
  height: 1870px;
}
  .line{
  position:absolute;
  left:142px;
  top:250px;
  height:1200px;
}
  .year{
  font-size: 2.4rem;
  padding-right: 60px;
    padding-top: 10px;
}
  .circle{
    padding-top: 10px;
  }
  .careercontent{
  padding-left: 60px;
}
  .future{
  font-size: 2.4rem;
  padding-right: 36px;
    padding-top: 10px;
}
      .careercontent h2{
  padding-bottom: 30px;
}
    .careercontent p{
  padding-bottom: 75px;
}
}

@media(max-width: 480px) {
  .line{
  position:absolute;
  left:100px;
  top:120px;
  height:1300px;
}
  .careers{
    top:160px;
    max-width: 100%;
  }
      .year{
  font-size: 1.6rem;
  padding:0 13px 60px 30px;
}
    .future{
  font-size: 1.4rem;
  padding-right: 5px;
    padding:0 5px 60px 30px;
}
    #sectioncareercontent{
        max-width: 100%;
  }
  .circle{
    padding:0px;
  }
  .section-career{
  height: 1860px;
}
    #future{
    padding-right: 6%;
}
.section-about h3 {
  font-size: 20px;
  font-weight: bold;
  margin:20px 0 20px 0;
  letter-spacing: 0.2rem;
  line-height: 28px;
  font-family: "Noto Sans JP", sans-serif;
}
}

/* STRENGTH----------- ------*/
.strengthphoto{
  padding: 0px 0 140px;
  width:34%;
  object-fit: cover;
}
.strengthcotentlist h2{
  font-weight: bold;
}
.strengthcotentlist3 h2{
  font-weight: bold;
}
.strengthcotentlist p{
  font-family: "Arial",'Noto Sans JP', sans-serif;
  font-weight: 600;
}
.strengthcotentlist1 p{
  font-family: "Arial",'Noto Sans JP', sans-serif;
  font-weight: 600;
}
.strengthcotentlist3 p{
  font-family: "Arial",'Noto Sans JP', sans-serif;
  font-weight: 600;
}

.no{
  font-family: 'Oswald', sans-serif;
    color:#ff8929;
}
.strengthdescription h2{
  padding-bottom: 40px;
  font-family: "Noto Sans JP", sans-serif;
}
.strengthcotentlist1 h2{
  font-weight: bold;
}
span.marker {
    background: linear-gradient(transparent 65%, #f9b568 50%);
}
  .careersp{
    margin: 0 auto 60px;
  }


@media(min-width: 1040px) {
  .strength{
  display:flex;
}
  .strengthtitle{
  padding-bottom: 80px;
}
  .strengthsp{
    display: none;
  }
  .strengthphotosp{
    display:none;
  }
  .strengthcotent{
  padding:0 120px 0 100px;
  text-align: left;
}
  .strengthcotentlist{
  display: flex;
  padding-bottom: 40px;
}
    .strengthcotentlist1{
  display: flex;
  padding-bottom: 40px;
}
  .strengthcotentlist3{
  padding-bottom: 140px;
  display: flex;
}
  .strengthcotentlist1 h2{
  padding-right: 30px;
  font-size: 3.4rem;
}
  .strengthcotentlist h2{
  padding-right: 30px;
  font-size: 3.4rem;
}
  .strengthcotentlist3 h2{
  padding-right: 30px;
  font-size: 3.4rem;
}
  .strengthcotentlist3 p{
  font-size: 1.8rem;
  line-height: 2.7rem;
      letter-spacing: 0.075rem;
}
.strengthcotentlist1 p{
  font-size: 1.8rem;
  line-height: 2.7rem;
  letter-spacing: 0.075rem;
}
  .strengthcotentlist p{
  font-size: 1.8rem;
  line-height: 2.7rem;
      letter-spacing: 0.075rem;
}
}
@media(max-width: 1040px){
    .strengthtitle{
   display: none;
}
    .strengthphoto{
    display:none;
  }
  .strengthcotent{
    position: relative;
  }
    .strengthphotosp{
    position: absolute;
      left:0px;
      top:250px;
      width: 92%;
  }
  .strengthcotentlist1{
    padding: 660px 8% 0;
    text-align: left;
  }
    .strengthcotentlist{
      text-align: left;
          padding: 30px 8%;
}
    .strengthcotentlist3{
      padding:0px 8% 50px;
      text-align: left;
}
    .strengthcotentlist1 h2{
  font-size: 4.2rem;
}
  .strengthcotentlist h2{
  font-size: 4.2rem;
}
  .strengthcotentlist3 h2{
  padding-right: 30px;
  font-size:4.2rem;
}
  .strengthcotentlist3 p{
  font-size: 2rem;
  line-height: 3.2rem;
}
.strengthcotentlist1 p{
  font-size: 2rem;
  line-height: 3.2rem;
}
    .strengthcotentlist p{
  font-size: 2rem;
  line-height: 3.2rem;
}
  .strengthdescription{
    padding-top: 30px;
  }
}


@media(min-width:600px) {
  .strengthsp{
    height: 140px;
  }
}

@media(max-width:600px) {
    .strengthphotosp{
    position: absolute;
      left:0px;
      top:100px;
      width: 92%;
  }
    .strengthcotentlist1{
    padding: 290px 30px 0;
    text-align: left;
  }
     .strengthcotentlist1 h2{
  font-size: 2.4rem;
}
  .strengthcotentlist h2{
  font-size: 2.4rem;
}
  .strengthcotentlist3 h2{
  padding-right: 30px;
  font-size:2.4rem;
}
  .strengthcotentlist3 p{
  font-size: 1.4rem;
  line-height: 2.4rem;
}
.strengthcotentlist1 p{
  font-size: 1.4rem;
  line-height: 2.4rem;
}
    .strengthcotentlist p{
  font-size: 1.4rem;
  line-height: 2.4rem;
}
  .strengthdescription{
    padding-top: 15px;
  }
    .strengthcotentlist{
  padding: 30px;
}
      .strengthcotentlist3{
      padding:0px 30px 45px;
      text-align: left;
}
    .strengthcotentlist3 p{
  font-size: 1.4rem;
  line-height: 2.4rem;
}
.strengthcotentlist1 p{
  font-size: 1.4rem;
  line-height: 2.4rem;
  letter-spacing: 0.075rem;
}
    .strengthcotentlist p{
  font-size: 1.4rem;
  line-height: 2.4rem;
}
  .strengthdescription h2{
  padding-bottom: 30px;
  }
}
/* 9photo----------- ------*/
.picturetitle{
  margin-bottom: 80px;
}
.item {
  width: 380px;
}
  .picrure-wrap{
  display: flex;
  flex-wrap: wrap;
}

@media not all and (min-width: 1040px) {
  .item {
    width: 200px;
    height:200px;
  }
  .item img{
    object-fit:cover;
    width: 100%;
    height: 100%;
  }
}

@media not all and (min-width: 480px) {
  .item {
    width: 100px;
    height:100px;
  }
  .item img{
    object-fit:cover;
    width: 100%;
    height: 100%;
  }
}
@media(max-width: 1040px){
  .picturetitle{
    display:none;
  }  
  .picturetitlesp{
  padding:60px;
  }
  .section-9picture{
    max-width:610px;
  text-align: center;
  margin:0 auto;
}
  .picrure-wrap{
  gap: 5px;
  max-width: 610px;
}
  .item .caption {
	font-size:		14px;
}
.item .caption h2{
padding-bottom: 20px;
  font-size: 2.4rem;
}

.item:hover .mask {
	padding-top:		60px;	/* ホバーで下にずらす */
}
}
@media(min-width: 1040px){
  .picturetitlesp{
    display:none;
  }
  .section-9picture{
  max-width: 1240px;
  text-align: left;
  margin:0 auto;
}
  .picrure-wrap{
  gap: 50px;
}
  .item .caption {
	font-size:		18px;
}
.item .caption h2{
padding-bottom: 20px;
  font-size: 3.2rem;
}

.item:hover .mask {
	padding-top:		150px;	/* ホバーで下にずらす */
}
}

@media(min-width:600px) {
  .picturetitlesp{
    height: 140px;
  }
}

@media(max-width:480px) {
  .section-9picture{
    max-width: 315px;
  }
  .picrure-wrap{
    max-width: 315px;
  }
    .picturetitlesp{
  padding:25px;
  }
    .item .caption {
	font-size:12px;
      max-width: 80px;
      margin:0 auto;
}
.item .caption h2{
padding-bottom: 8px;
  line-height:1.8rem;
  font-size: 1.4rem;
}
  .item .caption p{
  font-size: 1.0rem;
    line-height: 1.5rem;
}

.item:hover .mask {
	padding-top:20px;	/* ホバーで下にずらす */
}
}
/*-----hover----*/
.item{
  position: relative;
  overflow: hidden;
}
.item .caption {
	text-align: 		center;
	color:			#fff;
}
.item .mask {
	width:			100%;
	height:			60%;
	position:		absolute;
	top:			0;
	left:			0;
	opacity:		0;	/* マスクを表示しない */
	background-color:	rgba(0,0,0,0.4);
	-webkit-transition:	all 0.6s ease;
	transition:		all 0.6s ease;
}
.item:hover .mask {
	opacity:		1;	/* マスクを表示する */
}


@media(max-width:1024px) {
.item .mask {
	width:			100%;
	height:			100%;
}


}