@charset "utf-8";

/*----------------------------
       coordinate
---------------------------*/
.cmnLead{
 overflow: hidden;
 padding-bottom: 248px;
}
.cmnLead h1{
 margin-bottom: 97px;
}
.imgList01{
 max-width: 998px;
 margin: 0 auto;
 justify-content: space-between;
}
@media screen and (min-width: 769px) {
 .imgList01 li{
  width: 44.5%;
  max-width: 443px;
 }
 .imgList01 li.pcOnly{
  width: 48%;
  max-width: 522px;
  margin-top: 64px;
 }
 .imgList01-01{
  margin-top: 150px !important;
 }
}/*//pc*/
@media screen and (max-width: 768px) {
 .cmnLead{
  padding-bottom:60px   
 }
.cmnLead h1{
 margin-bottom: 55px;
}

 .imgList01 li.spOnly{
  margin-bottom: 10px;
 }
}/*//sp*/


/* natural
-----------------------------*/
.natural{
 overflow: hidden;
 position: relative;
 padding: 200px 3% 195px;
 margin: 0 auto;
}
.natural::before{
 content: "";
 display: block;
 background: url("../img/dress/bg_green.png") no-repeat right top / cover;
 position: absolute;
 left: 0;
 top: 0;
 width: 100%;
 height:658px;
 z-index: -1;
}
.natural ul.pcFlex{
 max-width: 1000px;
 flex-wrap: wrap;
 justify-content: space-between;
 margin: 100px auto 0;
}
@media screen and (min-width: 769px) {
.natural h2{
  max-width: 1000px;
  margin: 0 auto;
  text-align: left;
 }
.natural ul li{
  width: 48%;
  margin-top: 37px;
 }
.natural ul li.wide{
  margin-top: -316px;
 }
.natural ul li.wide img.pcOnly{
  margin-top: 32px;
 }
}/*//pc*/
@media screen and (max-width: 768px) {
.natural{
 padding:65px 0 67px;
}
.natural ul.pcFlex{
 margin-top: 8px;
}
.natural ul li{
 width: 87vw;
  margin: 10px auto 0;
 }
 .natural ul li.wide{
  width: auto;
 }
}/*//sp*/

/* .classical
-----------------------------*/
.classical{
 overflow: hidden;
 position: relative;
 padding: 209px 3% 195px;
 margin: 0 auto;
}
.classical::before{
 content: "";
 display: block;
 background: url("../img/dress/bg_green.png") no-repeat right top / cover;
 position: absolute;
 left: 0;
 top: 0;
 width: 100%;
 height:658px;
 z-index: -1;
}
.classical ul.pcFlex{
 max-width: 1000px;
 flex-wrap: wrap;
 justify-content: space-between;
 margin: 153px auto 0;
}
@media screen and (min-width: 769px) {
 .classical .txt{
  max-width: 1000px;
  margin: 0 auto;
 }
.classical h2{
  width: 360px;
  margin-left: auto;
 margin-bottom: 0;
  text-align: left;
 }
.classical ul li{
  width: 48%;
 }
.classical ul li.wide{
 margin-top: -382px;
 }
 .classical ul li.wide .pcOnly img{
  margin-top: 46px;
 }
}/*//pc*/
@media screen and (max-width: 768px) {
.classical{
 padding:65px 0 67px;
}
.classical ul.pcFlex{
 margin-top: 0;
}
.classical ul li{
 width: 87vw;
  margin: 10px auto 0;
 }
.classical ul li.wide{
  width: auto;
  margin: 0;
 }
}/*//sp*/


/* elegant
-----------------------------*/
.elegant{
 overflow: hidden;
 position: relative;
 padding: 200px 3% 195px;
 margin: 0 auto;
}
.elegant::before{
 content: "";
 display: block;
 background: url("../img/dress/bg_green.png") no-repeat right top / cover;
 position: absolute;
 left: 0;
 top: 0;
 width: 100%;
 height:658px;
 z-index: -1;
}
.elegant ul.pcFlex{
 max-width: 1000px;
 flex-wrap: wrap;
 justify-content: space-between;
 margin: 100px auto 0;
}
@media screen and (min-width: 769px) {
.elegant h2{
  max-width: 1000px;
  margin: 0 auto;
  text-align: left;
 }
.elegant ul li{
  width: 48%;
 }
.elegant ul li.wide{
  margin-top: -316px;
 }
.elegant ul li.wide img.pcOnly{
  margin-top: 32px;
 }
}/*//pc*/
@media screen and (max-width: 768px) {
.elegant{
 padding:65px 0 67px;
}
.elegant ul.pcFlex{
 margin-top: 0;
}
.elegant ul li{
 width: 87vw;
  margin: 10px auto 0;
 }
 .elegant ul li.wide{
  width: auto;
  margin: 0 0 20px;
 }
}/*//sp*/

/* .botanical
-----------------------------*/
.botanical{
 overflow: hidden;
 position: relative;
 padding: 209px 3% 185px;
 margin: 0 auto;
}
.botanical::before{
 content: "";
 display: block;
 background: url("../img/dress/bg_green.png") no-repeat right top / cover;
 position: absolute;
 left: 0;
 top: 0;
 width: 100%;
 height:658px;
 z-index: -1;
}
.botanical ul.pcFlex{
 max-width: 1000px;
 flex-wrap: wrap;
 justify-content: space-between;
 margin: 153px auto 0;
}
@media screen and (min-width: 769px) {
 .botanical .txt{
  max-width: 1000px;
  margin: 0 auto;
 }
.botanical h2{
  width: 360px;
  margin-left: auto;
 margin-bottom: 0;
  text-align: left;
 }
.botanical ul li{
  width: 48%;
 }
.botanical ul li.wide{
 margin-top: -382px;
 }
 .botanical ul li.wide .pcOnly{
  margin-top: 46px;
 }
}/*//pc*/
@media screen and (max-width: 768px) {
.botanical{
 padding:65px 0 67px;
}
.botanical ul.pcFlex{
 margin-top: 0;
}
.botanical ul li{
 width: 87vw;
  margin: 10px auto 0;
 }
.botanical ul li.wide{
  width: auto;
  margin: 0 0 20px;
 }
}/*//sp*/


/* .sweet
-----------------------------*/
.sweet{
 overflow: hidden;
 position: relative;
 padding: 209px 3% 185px;
 margin: 0 auto;
}
.sweet::before{
 content: "";
 display: block;
 background: url("../img/dress/bg_green.png") no-repeat right top / cover;
 position: absolute;
 left: 0;
 top: 0;
 width: 100%;
 height:658px;
 z-index: -1;
}
.sweet ul.pcFlex{
 max-width: 1000px;
 flex-wrap: wrap;
 justify-content: space-between;
 margin: 153px auto 0;
}
@media screen and (min-width: 769px) {
 .sweet .txt{
  max-width: 1000px;
  margin: 0 auto;
 }
.sweet h2{
  width: 360px;
  margin-left: auto;
 margin-bottom: 0;
  text-align: left;
 }
.sweet ul li{
  width: 48%;
 }
.sweet ul li.wide{
 margin-top: -382px;
 }
}/*//pc*/
@media screen and (max-width: 768px) {
.sweet{
 padding:65px 0 146px;
}
.sweet ul.pcFlex{
 margin-top: 0;
}
.sweet ul li{
 width: 87vw;
  margin: 10px auto 0;
 }
.sweet ul li.wide{
  width: auto;
  margin: 0 0 20px;
 }
}/*//sp*/

/* .original
-----------------------------*/
.original{
 overflow: hidden;
 position: relative;
 max-width: 900px;
 margin: 0 auto 258px;
}
.original figure{
 margin-top: 98px;
}
@media screen and (max-width: 768px) {
 .original{
 margin: 0 auto 129px;
}
 .original figure{
 margin-top: 50px;
}
}/*//sp*/