/*------------------------------------*\
#GENERAL
\*------------------------------------*/

@charset "utf-8";

.l-container a:hover img {
  opacity: 0.6 !important;
}

.wrap {
  width: 1280px;
  overflow: hidden;
  margin: 0 auto;
  padding: 20px 0 0;
  color: #333333;
  font-family: Yu Gothic;  
}

.page-ttl {
  margin: 0 0 30px 0;
  color: #313131;
  font-size: 16px;
  line-height: 1.6;
}

.contents {
  font-size: 10px;
}

.contents__inner {
  width: 900px;
  margin: 0 auto;
}


.red {
  color: #dc0050;
}

/*kv*/
.kv {
  position: relative;
  overflow: hidden;
  min-height: 36em;
  background: #f2f0ef;
  margin-bottom: 6.5em;
}

.kv__bg {
  width: 465em;
  height: 36em;
}

.kv__title {
  position: absolute;
  top: 0;
  left: 0;
}

/*lead*/
.lead {
  margin-bottom: 7em;
  text-align: center;
}

.lead__p {
  font-size: 2.6em;
}

/*btn-area*/
.btn-area {
  position: relative;
  width: 55.6em;
  display: -webkit-flex;
  display: -moz-flex;
  display: -ms-flex;
  display: -o-flex;
  display: flex;
  flex-wrap: wrap;
  justify-content: center;
  align-content: center;
  height: 10em;
  background: #333333;
  box-shadow: 0.4em 0 1em rgba(0, 0, 0, 0.3);
  border-radius: 7em;
  margin: 7em auto;
}

.btn-area:hover {
  opacity: 0.8;
}

.btn-area:after {
  position: absolute;
  top: 50%;
  transform: translateY(-50%);
  right: 3.6em;
  display: block;
  width: 8.5em;
  height: 1.7em;
  background: url(/s/ladies/article/SL23SP102/img/230106/sp/btn_arw.png) no-repeat top left;
  background-size: 8.5em auto;
  content: '';
}

.btn-area--white {
  border: 0.2em solid #333333;
  background: #fff;
}

.btn-area--white:after {
  background: url(/s/ladies/article/SL23SP102/img/230106/sp/btn_arw.png) no-repeat bottom left;
  background-size: 8.5em auto;
}

.btn-area__txt {
  font-size: 3em;
  color: #fff;
}

.btn-area--white .btn-area__txt {
  color: #333;
}

.btn-area--longtxt {
  padding-right: 7em;
}

/*block*/
.block {
  margin: 10em 0;
}

.block.type-details--straight,
.block.type-details--wave {
  margin: 6em 0;
}
.block.type-details--natural {
    margin: 6em 0 0 0;
}

.block--bg {
  margin-left: -6.2em;
  margin-right: -6.2em;
  padding: 4em 0;
  background: #f3eeea;
}

.block--bg .btn-area {
  margin-top: 3em;
  margin-bottom: 3em;
}

.midashi{
font-weight: normal;
  width: 90%;
  margin: 0 auto 3em;
  padding-bottom: 0.4em;
  text-align: center;
  font-size: 1.5em;
  line-height: 2em;
}
.midashi .ttl__txt {
  font-size: 4em;
  font-weight: bold;
  border-bottom: 0.1em solid #333;
}
.block__ttl {
  width: 90em;
  margin: 0 auto 3em;
  padding-bottom: 0.4em;
  text-align: center;
}

.block__ttl .ttl__txt {
  font-size: 4em;
  font-weight: bold;
}

.block__txt {
  padding: 0 6.4em 2em;
}

.block__txt--bg {
  margin: 0 3.8em 3em;
    padding: 1.7em 3.7em;
  background: #f3eeea;
}

.block__txt .txt__p {
  margin-bottom: 1em;
  font-size: 2em;
}

.block__txt--bg .txt__p {
  line-height: 1.8;
}

.block__txt .txt__p:last-of-type {
  margin-bottom: 0;
}

/*type*/
.type {
  display: -webkit-flex;
  display: -moz-flex;
  display: -ms-flex;
  display: -o-flex;
  display: flex;
  flex-wrap: wrap;
  background: #fff;
  padding: 5.6em 0;
}

.type__item {
  width: 33.33%;
  border-right: 0.4em solid #f3eeea;
  text-align: center;
}

.type__item:last-child {
  border-right: 0;
}

.type-ttl {
  padding: 0.65em 0;
  width: 17.2em;
  margin: 0 auto 1.8em;
  background: #333333;
  border-radius: 4em;
  text-align: center;
}

.type-ttl__txt {
  font-size: 3.2em;
  color: #fff;
  font-family: Century Gothic;
}

.type-subttl {
  font-size: 2.2em;
  font-weight: bold;
}
.type-subtxt {
  font-size: 2.2em;
  line-height: 1.2;
  min-height: 2.5em;
}

/*desc-list*/
.desc-list {
  display: -webkit-flex;
  display: -moz-flex;
  display: -ms-flex;
  display: -o-flex;
  display: flex;
  flex-wrap: wrap;
  padding: 0 1em;
}

.desc-list__item {
  width: 33.33%;
  padding: 3em 1em 1em;
}

.desc-list__item-txt {
  font-size: 1.8em;
}

.desc-list__item .uline {
  font-weight: bold;
  text-decoration: underline;
}

/*diagnose01*/
.diagnose01 {
  margin-left: -6.2em;
  margin-right: -6.2em;
  display: -webkit-flex;
  display: -moz-flex;
  display: -ms-flex;
  display: -o-flex;
  display: flex;
  flex-wrap: wrap;
  justify-content: space-between;
  width: 95%;
  margin-left: auto;
  margin-right: auto;
}
.diagnose01__question {
  position: relative;
  margin: 0 0 6em;
  padding-bottom: 6em;
  width: 49%;
}

.diagnose01__bg {
  background: #F7EDF2;
  display: block;
  position: absolute;
  width: 100%;
  height: calc(100% - 0em);
  bottom: 0;
}

.diagnose01__button {
  margin: 0 auto;
  width: 100%;
}
.diagnose01__button .btn-area {
  margin-top: 0;
  margin-bottom: 0;
  cursor: pointer;
}
.diagnose01__button .btn-area:after {
  content: none;
}


.question-title {
  position: relative;
  text-align: center;
  padding: 0 2em;
  margin-bottom: 1em;
}

.question-title__sub {
  display: block;
  margin-bottom: 1em;
  font-size: 4em;
}

.question-title__main {
  display: block;
  font-size: 2.1em;
  margin-bottom: 5%;
}
.question-title__main_s {
  display: block;
  font-size: 1.3em;
  line-height: 1.5em;
  margin-bottom: 10px;
}

.question__select {
  position: relative;
  padding: 0 2em;
}

.question__select label {
  position: relative;
  display: -webkit-flex;
  display: -moz-flex;
  display: -ms-flex;
  display: -o-flex;
  display: flex;
  flex-wrap: wrap;
  align-items: center;
  height: 7em;
  margin-bottom: 1.5em;
  padding: 0;
  background-color: #fff;
  border-radius: 2em;
}

.question__select label:last-of-type {
  margin-bottom: 0;
}

.question__select input {
  position: absolute;
  width: 100%;
  height: 100%;
  top: 0;
  left: 0;
  background-color: transparent;
}

.question__select input:checked {
  border: 2px solid #FF5B75;
  border-radius: 2em;
}

.select__title {
  width: 8em;
  padding-left: 1em;
  text-align: center;
}

.select__title-txt {
  font-family: Century gothic;
  font-size: 2em;
}

.select__description {
  font-size: 1.2em;
  line-height: 1.6em;
  width: 15em;
  font-weight: normal;
}
.setumei {
  font-size: 1.3em;
  line-height: 2em;
  width: 80%; 
  margin-bottom: 10%; 
  margin-right: auto; 
  margin-left: auto;
  font-weight: normal;
  margin-bottom: 10%;
}
.setumei_st {
color: #2294b0;
font-weight: bold;
font-size: 2em;
width: 100%;
display: block;
text-align: center;
}
.setumei_we {
color: #f75367;
font-weight: bold;
font-size: 2em;
width: 100%;
display: block;
text-align: center;

}
.setumei_nt {
color: #42b274;
font-weight: bold;
font-size: 2em;
width: 100%;
display: block;
text-align: center;
}

.kotu_box{
position: relative;
}
.kotu_box p {
position: absolute;
left: 40% ;
left: 40% ;
top: 50%;
color: #666;
font-weight: bold;
font-size: 4em;
}

.kansyu_box{
position: relative;
}
.kansyu_box p {
position: absolute;
left: 10% ;
top: 20%;
color: #666;
font-weight: bold;
font-size: 3em;
line-height: 1.5em;
}


/*type-result*/
.type-result {
  position: relative;
  display: none;
  width: 95%;
  text-align: center;
}

.type-result__btn {
  position: absolute;
  left: 8em;
  bottom: 7.5em;
  width: 38.6em;
  display: -webkit-flex;
  display: -moz-flex;
  display: -ms-flex;
  display: -o-flex;
  display: flex;
  flex-wrap: wrap;
  justify-content: center;
  align-items: center;
  height: 8em;
  background: #333333;
  border-radius: 6.5em;
  letter-spacing: 0.3em;
  box-shadow: 0.3em 0 1em rgba(0, 0, 0, 0.3);
  margin-left: auto;
  margin-right: auto;
}
.type-result__btn:hover {
  opacity: 0.8;
}
.type-result__btn-txt {
  color: #fff;
  font-size: 3.5em;
}

.detail__mv {
  background: #f3eeea;
}

/*accord*/
.accord-btn {
  position: relative;
  display: -webkit-flex;
  display: -moz-flex;
  display: -ms-flex;
  display: -o-flex;
  display: flex;
  flex-wrap: wrap;
  justify-content: center;
  align-content: center;
  background: #888;
  height: 10em;
  cursor: pointer;
}

.type-details--straight .accord-btn {
  background-color: #ffffff;
}

.type-details--wave .accord-btn {
  background-color: #ffffff;
}

.type-details--natural .accord-btn {
  background-color: #ffffff;
}

.accord-btn__txt {
  color: #fff;
  font-weight: bold;
  font-size: 3.5em;
}

.accord-btn:after {
  content: '';
  position: absolute;
  right: 4em;
  top: 50%;
  transform: translateY(-50%) rotate(45deg);
  border: solid #fff;
  border-width: 0 0.4em 0.4em 0;
  display: inline-block;
  padding: 1em;
  transition: all 0.5s ease;
}

.accord-btn.open:after {
  transform: translateY(-50%) rotate(-135deg);
}

.accord-content {
  display: none;
}

.accord-content__inner {
  padding: 5.8em 3em;
  background: #f3eeea;
}

.accord__ttl {
  padding: 2.4em 0;
  margin: 0 3.4em 4.8em;
  border-bottom: 0.2em solid #888;
  border-top: 0.2em solid #888;
  text-align: center;
}

.accord__ttl-txt {
  font-size: 2.8em;
  line-height: 1.3;
  color: #888;
  font-weight: normal;
}

.type-details--straight .accord__ttl {
  border-color: #d24ba3;  
}

.type-details--wave .accord__ttl {
  border-color: #279d7c;  
}

.type-details--natural .accord__ttl {
  border-color: #ffa828;
}

.type-details--straight .accord__ttl-txt {
  color: #d24ba3;  
}

.type-details--wave .accord__ttl-txt {
  color: #279d7c;
}

.type-details--natural .accord__ttl-txt {
  color: #ffa828;
}

.accord__body {
  margin: 0 3.4em 6.5em;
}

.accord__body:last-of-type {
  margin-bottom: 0;
}
.accord__body .text-p {
  font-size: 2.2em;
}

.accord__body .text-p--center {
  text-align: center;
}

.body-specs {
    width: 90%;
    margin: 0 auto;
    margin-bottom: 3em;
}

.match-table {
  display: -webkit-flex;
  display: -moz-flex;
  display: -ms-flex;
  display: -o-flex;
  display: flex;
  flex-wrap: wrap;
  margin: 4em -3.8em;
  padding: 2.3em 0.5em 4em;
  background: #fff;
}

.match-table__item {
  padding: 0 1.3em 2em;
  border-left: 0.2em solid #f3eeea;
  border-right: 0.2em solid #f3eeea;
  width: 50%;
  text-align: center;
}

.match-table__item:nth-child(odd) {
  border-left: 0;
}

.match-table__item:nth-child(even) {
  border-right: 0;
}

.match-table__item:nth-child(n+4) {
  padding-bottom: 2em;
}

.type-details--straight .match-table__item--01,
.type-details--straight .match-table__item--02,
.type-details--straight .match-table__item--03 {
  width: 33.33%;
  margin-bottom: 1.6em;
}

.type-details--straight .match-table__item--02,
.type-details--straight .match-table__item--04,
.type-details--straight .match-table__item--06 {
  border-right: 0.2em solid #f3eeea;
}

.type-details--straight .match-table__item--03,
.type-details--straight .match-table__item--05,
.type-details--straight .match-table__item--07 {
  border-left: 0.2em solid #f3eeea;
}

.type-details--straight .match-table__item--01,
.type-details--straight .match-table__item--04,
.type-details--straight .match-table__item--06 {
  border-left: 0;
}

.type-details--straight .match-table__item--03,
.type-details--straight .match-table__item--05,
.type-details--straight .match-table__item--07 {
  border-right: 0;
}

.match-table__item .item__dt {
  display: block;
  font-size: 2.2em;
  line-height: 1.9;
  background: #f3eeea;
  margin-bottom: 0.5em;
}

.match-table__item .item__dd {
  display: block;
  font-size: 2.2em;
}

.hairstyle__img {
text-align: center;
}

.hairstyle__point {
  display: -webkit-flex;
  display: -moz-flex;
  display: -ms-flex;
  display: -o-flex;
  display: flex;
  flex-wrap: wrap;
  justify-content: space-between;
}

.hairstyle__point li {
  width: 36em;
}

.hairstyle__point li .point__num {
  text-align: center;
  font-size: 3em;
}

.hairstyle__point li .point__txt {
  font-size: 2.2em;
}

/*type-item*/
.type-item {
  margin-top: 4.5em;
}

.type-item__li {
  display: -webkit-flex;
  display: -moz-flex;
  display: -ms-flex;
  display: -o-flex;
  display: flex;
  flex-wrap: wrap;
  margin-bottom: 6em;
  padding: 3em 2em 3em 3em;
  background: #fff;
}
.type-item__li:last-child {
  margin-bottom: 0;
}

.type-item__li .item-image {
  width: 40.6em;
  margin-right: 2.75em;
}

.type-item__li .item-txt {
  width: 35.5em;
}

.type-item__li .item-txt__p {
  font-size: 2.2em;
}

.type-item__li .btn-area {
  margin-top: 2em;
  margin-bottom: 0;
}

/*launch-date*/
.launch-date {
  margin: 2.5em 1.5em;
  text-align: right;
}

.launch-date__txt {
  font-size: 2.2em;
}

/*diagnosis*/
.diagnosis .btn-area {
  width: 65.8em;
  margin-top: 2em;
  margin-bottom: 2em;
}

/*profile*/
.profile {
  margin: 8em 3.8em;
  padding: 1.2em 3em 5em 4.8em;
  background: #f3eeea;
}


.profile__ttl {
  width: 41.8em;
  text-align: center;
  float: left;
  margin-top: 5.7em;
}

.profile__ttl .ttl-sub {
  margin-bottom: 3em;
}
.profile__ttl .ttl-name {
  margin-bottom: 2em;
}

.profile__ttl .ttl-sub,
.profile__ttl .ttl-name {
  padding-bottom: 3em;
  border-bottom: 0.2em solid #333;
  line-height: 1;
}

.profile__ttl .ttl-sub__txt {
  font-size: 2.8em;
}

.profile__ttl .ttl-name__txt {
  font-size: 4.2em;
}

.profile__img {
  width: 30.8em;
  float: right;
}

.profile__txt{
clear: both;
}

.profile__txt-p {
  font-size: 2.2em;
  line-height: 1.6;
}

/*specialContents__blk*/
.special-contents {
  margin: 3.333vw 0 0 0;
}

.specialContents__blk {
  margin: 10em 0;
}

.contents .blk_hot_content.casual .hot_inner .ttl,
.specialContents__blkTtl {
  font-size: 5em;
  border-bottom: 0.267vw solid #333;
  text-align: center;
  font-weight: bold;
}

.special-contents ul {
  letter-spacing: -0.4em;
  text-align: center;
}

.special-contents ul li.wide {
  width: 82%;
}

.special-contents ul li.half {
  width: 40%;
}

.special-contents ul li {
  display: inline-block;
  vertical-align: top;
  letter-spacing: normal;
  text-align: left;
  margin: 0 1.3% 4%;
  width: 20em;
}

.special-contents p {
  font-size: 1.4em;
  margin: 0.5em 0 0 0;
}

.contents .blk_hot_content .hot_content {
  border: navajowhite;
}

.contents .blk_hot_content.casual .hot_inner .ttl {
  color: #333;
}
.mag0{
margin: 0;
padding: 
}

@media screen and (max-width: 768px) {
.midashi{
font-weight: normal;
  width: 90%;
  margin-top: 15px;
  padding-bottom: 0.4em;
  text-align: center;
  font-size: 1.5em;
  line-height: 1.7em;
}
.midashi .ttl__txt {
  font-size: 2.5em;
  border-bottom: 0.1em solid #333;
}
.block__ttl .ttl__txt {
  font-size: 2.5em;
}
.diagnose01__question {
  position: relative;
  margin: 0 0 6em;
  padding-bottom: 6em;
  width: 99%;
}
.select__title {
  display: block;
  width: 90%;
  margin-left: auto;
  margin-right: auto;
  text-align: center;
  padding: 0;
}
.select__title-txt {
  font-size: 1.5em;
}
.select__description {
  font-size: 1em;
  line-height: 1.3em;
  text-align: center;
  width: 90%;
  margin-left: auto;
  margin-right: auto;
  padding: 0;
  font-weight: normal;
}

/*btn-area*/
.btn-area {
  position: relative;
  width: 90%;
  display: -webkit-flex;
  display: -moz-flex;
  display: -ms-flex;
  display: -o-flex;
  display: flex;
  flex-wrap: wrap;
  justify-content: center;
  align-content: center;
  height: 10em;
  background: #333333;
  box-shadow: 0.4em 0 1em rgba(0, 0, 0, 0.3);
  border-radius: 7em;
  margin: 7em auto;
}
.kotu_box p {
position: absolute;
left: 30% ;
top: 45%;
font-weight: bold;
font-size: 1.5em;
}

.kansyu_box p {
position: absolute;
left: 5% ;
top: 30%;
color: #666;
font-weight: bold;
font-size: 1.3em;
}
.setumei_st {
font-size: 1.5em;
}
.setumei_we {
font-size: 1.5em;
}
.setumei_nt {
font-size: 1.5em;
}
.setumei {
  font-size: 1.3em;
  line-height: 1.5em;
  width: 80%; 
  margin-bottom: 10%; 
  margin-right: auto; 
  margin-left: auto;
  font-weight: normal;
  margin-bottom: 10%;
}

}