@charset "utf-8";
body{
  padding-top: 120px;
}
/* 共通 */
#main-visual,
#display-image,
#images__only-sp{
  max-width: 1000px;
  margin: 0 auto;
  padding:0 30px;
}
/* works ロゴ */
 h2{
  position: relative;
  margin-top: 85px;
  margin-bottom: 45px;
}
 h2 img{
  width: 266px;
  position: absolute;
  bottom: 0;
  z-index: -1;
}
 h2 p{
  font-size: 72px;
  font-weight: 400;
  margin-bottom: 80px;
}
/* works トップ画像 共通 */
#main-visual .img-wrapper{
max-width: 940px;
margin: 0 auto;
text-align: center;
border-radius: 5px;
background-color: #ffffff;
box-shadow: 2.5px 2.5px 10px #ddd9d9;
}

/* トップ画像　共通 */
#main-visual .title{
  font-size: 27px;
  margin-bottom: 40px;
}
#main-visual ul{
  margin: 60px auto 200px;
  /* font-family: "Yu Gothic Pr6N R"; */
  font-family: Yu Gothic Pr6N R;
}
#main-visual ul li{
  display: flex;
  padding: 40px 0px;
  /* align-items: center; */
  border-bottom: solid #c7c5c4 0.25px;
}
#main-visual ul li .subtitle{
  width: 20%;
  font-weight: 500;
  line-height: 1.8;
}

/* 767px以下はここから読み込み*/
@media screen and (max-width: 767px){
  #main-visual  h2 p{
    font-size: 50px;
    margin-bottom: 60px;
  }
  #main-visual h2 img{
    width: 180px;
  }
  #main-visual .title{
    font-size: 18px;
    margin-bottom: 23px;
  }
  #main-visual ul li{
    display: block;
    padding: 24px 0;
  }
  #main-visual ul li .subtitle{
    width: 100%;
    padding-bottom: 10px;
    font-weight: 500;
  }
}

/* 画像共通*/
#main-visual .img-wrapper img{
  width: 89%;
  margin-top: 3%;
  margin-bottom: 2%;
}
/* バーガー画像 */
#main-visual .img-wrapper-burger{
  width: 100%;
  height: 62%;
  margin: 0 auto;
  text-align: center;
  border-radius: 5px;
  background-color: #ffffff;
  box-shadow: 2.5px 2.5px 10px #ddd9d9;
}
#main-visual .img-inner-burger{
  display: flex;
  justify-content: space-between;
  width: 100%;
  align-items: center;
  padding: 13% 3% 13% 3%;
}
#main-visual .img-inner-burger .burger-pop{
  width: 34.58%;
}
#main-visual .img-inner-burger .burger-koukyuu{
  width: 62%;
}
#main-visual .img-wrapper-burger .img-inner-burger .burger-koukyuu img,
#main-visual .img-wrapper-burger .img-inner-burger .burger-pop img{
  height: auto;
}

/* hairsalon内容説明文 */
#main-visual .description__hairsalon{
  max-width: 700px;
}
/* cafe内容説明文*/
#main-visual .description__cafe{
  max-width: 640px;
}
/* trip内容説明文*/
#main-visual .description__trip-banner{
  max-width: 866px;
}
/* 内容説明文 共通 */
#main-visual ul li .subtitle{
  font-size: 16px;
  font-weight: bold;
  line-height: 1.8;
}
#main-visual ul li .text{
  width: 100%;
  font-size: 16px;
  line-height: 1.8;
}
/* hairsalon,workers 共通 */
#display-image ul{
  display: flex;
  justify-content: space-between;
}
#display-image ul .display-image__pc{
  width: 71%
}
#display-image ul .display-image__sp{
  width: 22%;
}
/* スマホのみ表示画像 */
#images__only-sp{
  display: none;
}

/* 767px以下はここから読み込み*/
@media screen and (max-width: 767px){
#images__only-sp{
  display: block;
}
#images__only-sp ul{
  display: flex;
  justify-content: space-between;
  gap: 30px;
}
#images__only-sp ul li img{
  width: 100%;
}
#display-image .display-image_only-pc{ 
  display: none;
}
#images__only-sp .only__sp_burger-pop{
  width: 66.66%;
  margin: 0 auto;
  margin-top: 60px;
}
#main-visual ul{
  margin: 60px auto 60px;
}
}