@charset "UTF-8";
@keyframes floater {
  0% {
    transform: translateY(0%);
  }
  50% {
    transform: translateY(-20px);
  }
  100% {
    transform: translateY(0%);
  }
}
@keyframes wiggle {
  0% {
    transform: rotate(0deg);
  }
  50% {
    transform: rotate(8deg);
  }
  100% {
    transform: rotate(0deg);
  }
}
@keyframes wobbling_x {
  0%, 100% {
    margin-left: 0px;
  }
  50% {
    margin-left: 10px;
  }
}
@keyframes wobbling_y {
  0%, 100% {
    margin-top: 0px;
  }
  50% {
    margin-top: 10px;
  }
}
@keyframes wobbling {
  0%, 100% {
    transform: rotate(0deg) translateY(0%) translateX(0%);
  }
  50% {
    transform: rotate(8deg) translateY(-10px) translateX(10px);
  }
}
@keyframes wobbling02 {
  0%, 100% {
    transform: rotate(0deg) translateY(0%) translateX(0%);
  }
  50% {
    transform: rotate(8deg) translateY(-10px) translateX(30px);
  }
}
@keyframes lftSlideIn {
  0% {
    opacity: 0;
    transform: translate(100px, 50px);
  }
  100% {
    opacity: 1;
    transform: translate(0, 0);
  }
}
@keyframes rhtSlideIn {
  0% {
    opacity: 0;
    transform: translate(-100px, -50px);
  }
  100% {
    opacity: 1;
    transform: translate(0, 0);
  }
}
@keyframes fadeRotateIn {
  0% {
    opacity: 0;
    transform: rotate(45deg) translateX(-100px);
  }
  100% {
    opacity: 1;
    transform: rotateY(0) translateX(0);
  }
}
@keyframes fadeRotateIn02 {
  0% {
    opacity: 0;
    transform: rotate(-45deg) translateX(100px);
  }
  100% {
    opacity: 1;
    transform: rotateY(0) translateX(0);
  }
}
@keyframes slideFadeZoomIn {
  0% {
    opacity: 0;
    transform: scale3d(0.3, 0.3, 0.3);
  }
  70% {
    opacity: 1;
  }
  100% {
    opacity: 1;
  }
}
@keyframes slideFadeZoomOut {
  0% {
    opacity: 0;
    transform: scale3d(1.5, 1.5, 1.5);
  }
  70% {
    opacity: 1;
  }
  100% {
    opacity: 1;
  }
}
@keyframes slideFadeInDown {
  0% {
    opacity: 0;
    margin-top: 20%;
  }
  70% {
    opacity: 1;
    margin-top: 25%;
  }
  100% {
    opacity: 1;
    margin-top: 25%;
  }
}
@keyframes slideFadeInDown2 {
  0% {
    opacity: 0;
    margin-top: 70%;
  }
  70% {
    opacity: 1;
    margin-top: 80%;
  }
  100% {
    opacity: 1;
    margin-top: 80%;
  }
}
@keyframes slideRhtSlideIn {
  0% {
    opacity: 0;
    transform: translate(-100px, 0);
  }
  40% {
    opacity: 0.2;
  }
  100% {
    opacity: 1;
    transform: translate(0, 0);
  }
}
@keyframes fadeIn {
  0% {
    opacity: 0;
  }
  100% {
    opacity: 1;
  }
}
@keyframes fadeOut {
  0% {
    opacity: 1;
  }
  100% {
    opacity: 0;
  }
}
@keyframes fadeZoomIn {
  0% {
    opacity: 0;
    transform: scale(0.5);
  }
  100% {
    opacity: 1;
    transform: scale(1);
  }
}
@keyframes lftSlideIn {
  0% {
    opacity: 0;
    transform: translate(100px, 0);
  }
  100% {
    opacity: 1;
    transform: translate(0, 0);
  }
}
@keyframes rhtSlideIn {
  0% {
    opacity: 0;
    transform: translate(-100px, 0);
  }
  100% {
    opacity: 1;
    transform: translate(0, 0);
  }
}
@keyframes fadeInUp {
  0% {
    opacity: 0;
    transform: translateY(20px);
  }
  100% {
    opacity: 1;
    transform: translateY(0);
  }
}
@keyframes fadeInDown {
  0% {
    opacity: 0;
    transform: translateY(-20px);
  }
  100% {
    opacity: 1;
    transform: translateY(0);
  }
}
@keyframes fadeRotateIn {
  0% {
    opacity: 0;
    transform: rotateY(45deg);
  }
  100% {
    opacity: 1;
    transform: rotateY();
  }
}
@keyframes flipInY {
  from {
    transform: rotate3d(0, 1, 0, 90deg);
    animation-timing-function: ease-in;
    opacity: 0;
  }
  60% {
    transform: rotate3d(0, 1, 0, 10deg);
    opacity: 1;
  }
  to {
    opacity: 1;
  }
}
html, body, div, span, object, iframe,
h1, h2, h3, h4, h5, h6, p, blockquote, pre,
abbr, address, cite, code,
del, dfn, em, img, ins, kbd, q, samp,
small, strong, sub, sup, var,
b, i,
dl, dt, dd, ol, ul, li,
fieldset, form, label, legend,
table, caption, tbody, tfoot, thead, tr, th, td,
article, aside, canvas, details, figcaption, figure,
footer, header, hgroup, menu, nav, section, summary,
time, mark, audio, video {
  margin: 0;
  padding: 0;
  border: 0;
  outline: 0;
  font-size: 100%;
  vertical-align: baseline;
  background: transparent;
}

body {
  line-height: 1;
}

article, aside, details, figcaption, figure,
footer, header, hgroup, menu, nav, section {
  display: block;
}

nav ul {
  list-style: none;
}

ul {
  list-style: none;
}

blockquote, q {
  quotes: none;
}

blockquote:before, blockquote:after,
q:before, q:after {
  content: "";
  content: none;
}

a {
  margin: 0;
  padding: 0;
  font-size: 100%;
  vertical-align: baseline;
  background: transparent;
}

/* change colours to suit your needs */
ins {
  background-color: #ff9;
  color: #000;
  text-decoration: none;
}

/* change colours to suit your needs */
mark {
  background-color: #ff9;
  color: #000;
  font-style: italic;
  font-weight: bold;
}

del {
  text-decoration: line-through;
}

abbr[title], dfn[title] {
  border-bottom: 1px dotted;
  cursor: help;
}

table {
  border-collapse: collapse;
  border-spacing: 0;
}

/* change border colour to suit your needs */
hr {
  display: block;
  height: 1px;
  border: 0;
  border-top: 1px solid #cccccc;
  margin: 1em 0;
  padding: 0;
}

input, select {
  vertical-align: middle;
}

img {
  border: 0;
  -ms-interpolation-mode: bicubic;
  vertical-align: bottom;
}

.m-btm10 {
  margin-bottom: 10px;
}

.m-btm15 {
  margin-bottom: 15px;
}

.m-btm20 {
  margin-bottom: 20px;
}
@media screen and (max-width: 599px) {
  .m-btm20 {
    margin-bottom: 15px;
  }
}

.m-btm30 {
  margin-bottom: 30px;
}
@media screen and (max-width: 599px) {
  .m-btm30 {
    margin-bottom: 20px;
  }
}

.m-btm40 {
  margin-bottom: 40px;
}
@media screen and (max-width: 599px) {
  .m-btm40 {
    margin-bottom: 25px;
  }
}

.m-btm50 {
  margin-bottom: 50px;
}
@media screen and (max-width: 599px) {
  .m-btm50 {
    margin-bottom: 30px;
  }
}

.m-lft10 {
  margin-left: 10px;
}

.m-lft15 {
  margin-left: 15px;
}

.m-lft20 {
  margin-left: 20px;
}

.m-rht10 {
  margin-right: 10px;
}

.m-rht15 {
  margin-right: 15px;
}

.m-rht20 {
  margin-right: 20px;
}

.m-top10 {
  margin-top: 10px;
}

.m-top15 {
  margin-top: 15px;
}

.m-top20 {
  margin-top: 20px;
}
@media screen and (max-width: 599px) {
  .m-top20 {
    margin-bottom: 15px;
  }
}

.m-top30 {
  margin-top: 30px;
}
@media screen and (max-width: 599px) {
  .m-top30 {
    margin-bottom: 20px;
  }
}

/* リンク　共通設定 */
a {
  color: #000000;
  text-decoration: none;
  transition: all 0.3s;
  position: relative;
  cursor: pointer;
}
a:hover {
  color: #000000;
}

img {
  max-width: 100%;
  height: auto;
  width: auto;
  image-rendering: -webkit-optimize-contrast;
}
a img {
  position: relative;
  transition: 0.3s;
  overflow: hidden;
}

/*　テキスト装飾設定　*/
.tBold {
  font-weight: bold;
}

.tRed {
  color: #bc2323;
}

.tGray {
  color: #666666;
}

.right {
  text-align: right;
}

.center {
  text-align: center;
}

/* ※を使った注意書き用*/
.ann {
  margin-left: 1em;
  text-indent: -1em;
}

/* ==========================================================================
  Base
========================================================================== */
*,
*:before,
*:after {
  box-sizing: border-box;
}

body {
  font-size: 1.25rem;
  line-height: 1.6;
  color: #000000;
  background: #fff;
  letter-spacing: 0.05em;
  position: relative;
  font-family: "Helvetica Neue", Arial, "Hiragino Kaku Gothic ProN", "Hiragino Sans", YuGothic, "Yu Gothic Medium", "Yu Gothic", Meiryo, sans-serif;
  font-feature-settings: "palt";
}
@media screen and (max-width: 1024px) {
  body {
    font-size: 1rem;
  }
}
@media screen and (max-width: 599px) {
  body {
    font-size: 0.875rem;
  }
}

_::-webkit-full-page-media,
_:future,
:root body {
  font-feature-settings: "pkna";
}

.wrap {
  max-width: 1200px;
  margin-left: auto;
  margin-right: auto;
}
@media screen and (max-width: 1200px) {
  .wrap {
    padding-left: 5%;
    padding-right: 5%;
  }
}
@media screen and (max-width: 599px) {
  .wrap {
    padding-right: 5%;
    padding-left: 5%;
  }
}

.wrap02 {
  max-width: 960px;
  margin-left: auto;
  margin-right: auto;
}

div:after,
section:after {
  content: "";
  display: block;
  clear: both;
}

input,
textarea {
  font-size: 1.125rem;
  line-height: 1.5;
  padding: 2px;
  font-family: "Helvetica Neue", Arial, "Hiragino Kaku Gothic ProN", "Hiragino Sans", YuGothic, "Yu Gothic Medium", "Yu Gothic", Meiryo, sans-serif;
  font-feature-settings: "palt";
}

/* 表示・非表示設定 */
@media screen and (max-width: 1200px) {
  .pc-only {
    display: none;
  }
}

.pc-none {
  display: none;
}
@media screen and (max-width: 1200px) {
  .pc-none {
    display: block;
  }
}

@media screen and (max-width: 960px) {
  .mid-none {
    display: none;
  }
}

.tb-only {
  display: none;
}
@media screen and (max-width: 1024px) {
  .tb-only {
    display: block;
  }
}

.mid-only {
  display: none;
}
@media screen and (max-width: 960px) {
  .mid-only {
    display: block;
  }
}

/*==============================================================================
    Contents Layout
==============================================================================*/
#container {
  padding-top: 70px;
  padding-bottom: 100px;
}
@media screen and (max-width: 599px) {
  #container {
    padding-top: 40px;
    padding-bottom: 40px;
  }
}

/*==========================================================================
  Header
========================================================================== */
header {
  width: 100%;
  height: calc(var(--vh) * 100);
  position: relative;
}
header .h1-title {
  font-weight: 100;
  font-family: "Hiragino Kaku Gothic ProN", "Hiragino Sans", "游ゴシック体", YuGothic, "游ゴシック Medium", "Yu Gothic Medium", "游ゴシック", "Yu Gothic", sans-serif;
  font-size: 0.5625rem;
  color: #ddd;
  position: absolute;
  top: -45px;
  left: 0;
  width: 100%;
  text-align: center;
  z-index: 2;
}

@media screen and (max-width: 599px) {
  header .h1-title {
    top: 13px;
  }
}
/*==========================================================================
  #mainArea
========================================================================== */
#main,
main {
  position: relative;
}
#main .deco,
main .deco {
  position: absolute;
  width: 20%;
  left: 5%;
  top: -100px;
}
#main .deco.deco02,
main .deco.deco02 {
  max-width: 290px;
  left: auto;
  right: 10%;
  top: -20px;
}
@media screen and (max-width: 960px) {
  #main,
  main {
    overflow: hidden;
  }
}

#main {
  width: 100%;
  height: 100%;
  position: relative;
}
#main .video {
  position: relative;
  height: 100%;
  width: 100%;
  overflow: hidden;
}
#main .video .img {
  width: 100%;
  height: 100%;
}
#main .video .img img {
  -o-object-fit: cover;
     object-fit: cover;
  width: 100%;
  height: 100%;
}
#main .video video {
  position: absolute;
  top: 50%;
  left: 50%;
  transform: translateX(-50%) translateY(-50%);
  width: 100%;
  height: 100%;
  -o-object-fit: cover;
     object-fit: cover;
}
#main #inner {
  overflow: hidden;
}
#main .decoArea {
  position: absolute;
  width: 100%;
  height: 100%;
  top: 0;
  overflow: hidden;
}
#main .decoArea .deco {
  left: 5%;
  top: -100px;
}
#main .decoArea .deco.deco01 {
  animation: fadeRotateIn 2.2s ease-in-out forwards, wobbling 3s ease-in-out 2.2s infinite alternate;
}
#main .decoArea .deco.deco02 {
  width: 5%;
  left: auto;
  right: 3%;
  bottom: 35%;
  top: auto;
  animation: lftSlideIn 1.5s ease-in-out 0s forwards, floater 3s ease-in-out 1.5s infinite alternate;
}
#main .decoArea .deco.deco03 {
  width: 8%;
  left: -40px;
  bottom: 20%;
  top: auto;
  animation: rhtSlideIn 1.5s ease-in-out 0s forwards, wiggle 3s ease-in-out 1.5s infinite alternate;
}
@media screen and (max-width: 1200px) {
  #main .video video {
    width: 100%;
    height: auto;
  }
}
@media screen and (max-width: 1200px) {
  #main .decoArea {
    display: none;
  }
}

/*----------------------------------------------------------------
	Footer
----------------------------------------------------------------*/
footer {
  padding: 100px 0;
  font-size: 1.125rem;
}
footer .logo {
  text-align: center;
  margin-bottom: 80px;
}
footer .logo img {
  width: 300px;
}
footer .flex {
  justify-content: space-between;
}
footer .flex .cntLft {
  width: 45%;
}
footer .flex .cntLft .map {
  width: 100%;
  height: 0;
  padding-bottom: 330px;
  position: relative;
  overflow: hidden;
}
footer .flex .cntLft .map iframe, footer .flex .cntLft .map object, footer .flex .cntLft .map embed {
  position: absolute;
  top: 0;
  left: 0;
  width: 100%;
  height: 100%;
}
footer .flex .cntRht {
  width: 45%;
}
footer .flex .cntRht .map {
  width: 100%;
  height: 0;
  padding-bottom: 330px;
  position: relative;
  overflow: hidden;
}
footer .flex .cntRht .map iframe, footer .flex .cntRht .map object, footer .flex .cntRht .map embed {
  position: absolute;
  top: 0;
  left: 0;
  width: 100%;
  height: 100%;
}
footer .flex h4 {
  font-weight: normal;
  text-align: center;
  border-top: #D9D9D9 solid 1px;
  border-bottom: #D9D9D9 solid 1px;
  font-size: 1.4rem;
  padding: 15px 0 20px;
  margin-bottom: 40px;
}
footer .flex h4 span {
  font-size: 1rem;
}
footer .flex .txt {
  line-height: 1.6;
  margin-bottom: 40px;
}
footer .supportImg {
  margin: 80px 0;
}
footer .info {
  text-align: center;
  margin: 40px 0;
}
footer .footer-link {
  text-align: center;
  margin: 50px 0;
  justify-content: center;
}
footer .footer-link p {
  padding: 0 40px;
}
footer #copyright {
  text-align: center;
}
@media screen and (max-width: 960px) {
  footer .logo img {
    width: 60%;
  }
  footer .flex .cntLft {
    width: 100%;
    margin-bottom: 30px;
  }
  footer .flex .cntRht {
    width: 100%;
  }
  footer .flex h4 {
    font-size: 1.2rem;
    margin-bottom: 20px;
    padding: 10px 0 15px;
  }
  footer .flex h4 span {
    font-size: 0.8rem;
  }
  footer .flex .txt {
    font-size: 0.9rem;
    margin-bottom: 20px;
    text-align: center;
  }
  footer .flex .map iframe {
    height: 200px;
  }
  footer .info {
    font-size: 0.9rem;
    max-width: 20px 0;
  }
  footer .footer-link {
    display: flex;
    font-size: 0.9rem;
  }
  footer .footer-link p {
    padding: 0 9px;
  }
  footer #copyright {
    font-size: 0.8rem;
  }
}

/*----------------------------------------------------------------
	見出し
----------------------------------------------------------------*/
.heading01 {
  display: flex;
  align-items: center;
  justify-content: center;
}

.heading02 {
  font-size: 1.5rem;
}
@media screen and (max-width: 599px) {
  .heading02 {
    font-size: 1.25rem;
  }
}

.heading03 {
  font-size: 2.5625rem;
  font-weight: bold;
}
@media screen and (max-width: 599px) {
  .heading03 {
    font-size: 1.25rem;
  }
}

.heading04 {
  font-size: 20px;
  position: relative;
  padding-left: 20px;
}
.heading04:before {
  content: "";
  position: absolute;
  top: 0.7em;
  left: 0px;
  width: 10px;
  height: 10px;
  background: #ffff00;
}

/*----------------------------------------------------------------
	ボタン
----------------------------------------------------------------*/
.btn {
  max-width: 1200px;
  width: 100%;
  height: 150px;
  margin: 0 auto;
  position: relative;
}
.btn::before {
  position: absolute;
  right: -10px;
  bottom: -10px;
  background: #9E073D;
  border-radius: 80px;
  content: "";
  width: 100%;
  height: 100%;
}
.btn a {
  display: flex;
  align-items: center;
  justify-content: center;
  background: #e51c51;
  width: 100%;
  height: 100%;
  text-decoration: none;
  text-align: center;
  border-radius: 80px;
  border: 1px solid #000;
  z-index: 2;
}
.btn a:hover {
  transform: translate(10px, 10px);
}
@media screen and (max-width: 960px) {
  .btn {
    max-width: inherit;
  }
  .btn a:hover {
    transform: translate(6px, 6px);
  }
}

.flex {
  display: flex;
}
@media screen and (max-width: 599px) {
  .flex {
    display: block;
  }
}

@media screen and (min-width: 599px) {
  a[href^="tel:"] {
    pointer-events: none;
    cursor: default;
  }
}
/*----------------------------------------------------------------
　2カラム
----------------------------------------------------------------*/
.column2 {
  display: flex;
}
.column2 .cntLft, .column2 .cntRht {
  width: 50%;
}

/*----------------------------------------------------------------
　3カラム
----------------------------------------------------------------*/
.column3 {
  display: flex;
  flex-wrap: wrap;
  margin-bottom: 40px;
}
.column3 li {
  width: calc((100% - 80px) / 3);
  margin-right: 40px;
}
.column3 li:nth-child(3n) {
  margin-right: 0;
}

/*----------------------------------------------------------------
	imgList
----------------------------------------------------------------*/
.imgList {
  display: flex;
}
.imgList li {
  width: calc((100% - 30px) / 3);
}
.imgList li + li {
  margin-left: 15px;
}

/*----------------------------------------------------------------
	typeList
----------------------------------------------------------------*/
.typeList {
  display: flex;
  justify-content: space-between;
}
.typeList li {
  position: relative;
}
.typeList li .titleArea {
  position: absolute;
  width: 150px;
  height: 150px;
  border-radius: 9px;
  background: #81171F;
  color: #FFF;
  top: -75px;
  left: 50%;
  transform: translateX(-50%);
  display: flex;
  align-items: center;
  justify-content: center;
  flex-direction: column;
}
.typeList li .titleArea .enSub {
  width: 80%;
}
.typeList li .titleArea .enSub img {
  max-height: 47px;
  max-width: 113px;
}
.typeList li .titleArea .txt {
  margin-top: 20px;
  font-size: 1rem;
  line-height: 1.6;
  font-weight: bold;
}
.typeList li.gorgeous .titleArea {
  background: #4B322C;
}
.typeList li.retro .titleArea {
  background: #00491F;
}
.typeList li.girly .titleArea {
  background: #CF9080;
}
.typeList li.originality .titleArea {
  background: #1F1E1F;
}
.typeList li.cool .titleArea {
  background: #073351;
}
.typeList li.sweet .titleArea {
  background: #EAA0C5;
}
.typeList li + li {
  margin-left: 15px;
}

/*----------------------------------------------------------------
	table
----------------------------------------------------------------*/
table {
  width: 100%;
  border-radius: 10px;
  border-collapse: separate;
  border-spacing: 0;
}
table td, table th {
  text-align: center;
  padding: 5px;
  border-top: 1px solid #000000;
  border-left: 1px solid #000000;
  border-right: 1px solid #000000;
  line-height: 1;
  vertical-align: middle;
}
table td.last, table th.last {
  border-bottom: 2px solid #000000;
}
table td.radius-top-left, table th.radius-top-left {
  border-radius: 7px 0 0 0;
}
table td.radius-top-right, table th.radius-top-right {
  border-radius: 0 7px 0 0;
}
table td.radius-bottom-left, table th.radius-bottom-left {
  border-radius: 0 0 0 7px;
}
table td.radius-bottom-right, table th.radius-bottom-right {
  border-radius: 0 0 7px 0;
}
@media screen and (min-width: 1024px) {
  table {
    font-size: 1.375rem;
  }
  table td, table th {
    padding: 10px;
    border-top: 2px solid #000000;
    border-left: 2px solid #000000;
    border-right: 2px solid #000000;
  }
}

.br-sp {
  display: none;
}

@media screen and (max-width: 960px) {
  .br-sp {
    display: inherit;
  }
}
.txt {
  line-height: 2.2;
}
@media screen and (max-width: 960px) {
  .txt {
    line-height: 1.8;
  }
}

.sup {
  font-size: 0.875rem;
  letter-spacing: 0.1em;
}
@media screen and (max-width: 599px) {
  .sup {
    font-size: 0.75rem;
  }
}

.intro {
  text-align: center;
}
@media screen and (max-width: 599px) {
  .intro {
    text-align: left;
  }
}

.marker {
  font-size: 1.625rem;
  font-weight: bold;
  background: linear-gradient(transparent 45%, #ffff00 0%);
  display: inline;
  padding: 0 1px 0;
}
@media screen and (max-width: 960px) {
  .marker {
    font-size: 1.25rem;
  }
}
@media screen and (max-width: 599px) {
  .marker {
    font-size: 1rem;
  }
}

.bnrArea {
  position: relative;
  z-index: 2;
}

.bgImg {
  position: absolute;
  z-index: -1;
  width: 100%;
  height: 100%;
  top: 0;
  left: 0;
}
.bgImg img {
  -o-object-fit: cover;
     object-fit: cover;
  width: 100%;
  height: 100%;
}

.grBox {
  background: #f8f8f8;
  padding: 50px 55px;
}
@media screen and (max-width: 960px) {
  .grBox {
    padding: 40px;
  }
}
@media screen and (max-width: 599px) {
  .grBox {
    padding: 30px;
  }
}

.bggr {
  background: #f0f0f0;
}

/*----------------------------------------------------------------
	CTA Area
----------------------------------------------------------------*/
.ctaArea {
  background: #f3f303;
  color: #fff;
  text-align: center;
  padding: 100px 0 150px;
}
.ctaArea .chatch {
  text-align: center;
  margin-bottom: 50px;
  padding-right: 290px;
}
.ctaArea .chatch img {
  max-width: 90%;
}
.ctaArea .btn {
  position: relative;
}
.ctaArea .btn::before {
  background: #008637;
  border: #000 solid 1px;
}
.ctaArea .btn a {
  background: #06c755;
  padding-right: 340px;
  padding-left: 120px;
}
.ctaArea .btn a::after {
  position: absolute;
  top: 39%;
  right: 8%;
  content: "";
  background: url(../images/furisode/cta/cta-arrow.svg) no-repeat center top;
  width: 24px;
  height: 40px;
}
.ctaArea .btn a::before {
  background: url(../images/furisode/cta/cta-woman.png) no-repeat center top;
  width: 305px;
  height: 447px;
  content: "";
  position: absolute;
  top: -150%;
  right: 5%;
  z-index: 3;
}
@media screen and (max-width: 599px) {
  .ctaArea {
    padding: 20px 0 80px;
  }
  .ctaArea .chatch {
    text-align: center;
    margin-bottom: 25px;
    padding-right: 80px;
  }
  .ctaArea .chatch img {
    width: 60%;
  }
  .ctaArea .btn {
    height: 80px;
    width: 90%;
  }
  .ctaArea .btn::before {
    right: -6px;
    bottom: -6px;
  }
  .ctaArea .btn a {
    padding-right: 10%;
    padding-left: 10%;
    justify-content: left;
  }
  .ctaArea .btn a::before {
    width: 110px;
    height: 160px;
    background-size: 100% auto;
    top: -80%;
  }
  .ctaArea .btn a::after {
    width: 10px;
    height: 20px;
    background-size: 100% auto;
  }
  .ctaArea .btn a img {
    width: 75%;
  }
}

.cta-campaign {
  display: none;
  bottom: 270px;
  right: 30px;
  width: 190px;
  position: fixed;
  z-index: 100;
}
.cta-campaign a {
  display: block;
}
.cta-campaign a:hover {
  transform: translate(6px, 6px);
}
@media screen and (max-width: 599px) {
  .cta-campaign {
    width: 100px;
    bottom: 120px;
    right: 10px;
  }
}

.ctaBtn {
  display: none;
  bottom: 100px;
  right: 50px;
  width: 140px;
  position: fixed;
  z-index: 100;
}
.ctaBtn a {
  z-index: 999;
  background: #06c755;
  border: #000000 solid 1px;
  text-align: center;
  padding: 28px 26px 28px 30px;
  border-radius: 10px;
  z-index: 999;
  display: block;
  width: 100%;
}
.ctaBtn a:hover {
  transform: translate(6px, 6px);
}
.ctaBtn a::after {
  position: absolute;
  top: 45%;
  right: 8%;
  content: "";
  background: url(../images/furisode/cta/cta-mini-arrow.svg) no-repeat center top;
  width: 12px;
  height: 19px;
}
.ctaBtn::before {
  background: #008637;
  right: -6px;
  bottom: -6px;
  border-radius: 10px;
  content: "";
  width: 140px;
  height: 135px;
  display: block;
  border: #000000 solid 1px;
  z-index: 1;
  position: absolute;
}
@media screen and (max-width: 599px) {
  .ctaBtn {
    width: 80px;
    bottom: 20px;
    right: 20px;
  }
  .ctaBtn a {
    padding: 10px 5px;
    height: 80px;
  }
  .ctaBtn a img {
    width: 80%;
  }
  .ctaBtn a::after {
    width: 6px;
    height: 10px;
    background-size: 100%;
  }
  .ctaBtn::before {
    width: 80px;
    height: 80px;
  }
}

/*----------------------------------------------------------------
	priBox
----------------------------------------------------------------*/
.priBox {
  z-index: 2;
  position: relative;
}
.priBox .inner {
  background: #fff;
  border: 1px solid #000;
  border-radius: 10px;
  padding: 60px 20px 35px;
  width: calc(100% - 10px);
  height: 100%;
}
.priBox .inner::after {
  width: calc(100% - 10px);
  height: 100%;
  background: #ffff00;
  position: absolute;
  content: "";
  bottom: -10px;
  right: 0;
  border: 1px solid #000;
  border-radius: 10px;
  z-index: -1;
}
.priBox.yellow .inner {
  background: #ffff00;
}
.priBox.green .inner {
  background: #cbee28;
}
.priBox.green .inner::after {
  background: #c5dc19;
}

/*----------------------------------------------------------------
	moreLoad btn
----------------------------------------------------------------*/
#next.moreread,
#postnext.moreread,
#casenext.moreread {
  text-align: center;
  margin-bottom: 20px;
}
#next.moreread .btn_moreList,
#postnext.moreread .btn_moreList,
#casenext.moreread .btn_moreList {
  margin-bottom: 10px;
}
#next.moreread .btn_moreList a,
#postnext.moreread .btn_moreList a,
#casenext.moreread .btn_moreList a {
  width: 280px;
  height: 50px;
  margin: 0 auto;
  border: 1px solid #ffff00;
  color: #fff;
  display: block;
  display: flex;
  align-items: center;
  justify-content: center;
  font-size: 1rem;
  position: relative;
  background: #ffff00;
  z-index: 2;
}
#next.moreread .btn_moreList a::before,
#postnext.moreread .btn_moreList a::before,
#casenext.moreread .btn_moreList a::before {
  -webkit-clip-path: polygon(10% 0, 100% 0, 100% 100%, 0% 100%);
          clip-path: polygon(10% 0, 100% 0, 100% 100%, 0% 100%);
  background: #db401c;
  content: "";
  width: 55%;
  height: 100%;
  position: absolute;
  right: 0;
  z-index: -1;
}
#next.moreread .btn_moreList a::after,
#postnext.moreread .btn_moreList a::after,
#casenext.moreread .btn_moreList a::after {
  font-family: "icomoon";
  content: "\e907";
  position: absolute;
  font-weight: normal;
  font-style: normal;
  font-size: 1rem;
  font-size: 0.625rem;
  transform: scale(0.7);
  right: 20px;
  top: calc(50% - 9px);
}
#next.moreread .btn_moreList a:hover,
#postnext.moreread .btn_moreList a:hover,
#casenext.moreread .btn_moreList a:hover {
  opacity: 0.7;
}
#next.moreread .center,
#postnext.moreread .center,
#casenext.moreread .center {
  text-align: center;
}

/*----------------------------------------------------------------
	アニメーション
----------------------------------------------------------------*/
.floater {
  animation-name: floater;
  animation-duration: 3s;
  animation-iteration-count: infinite;
  animation-timing-function: ease-in-out;
  visibility: visible !important;
}

.wiggle {
  animation-name: wiggle;
  animation-duration: 2.5s;
  animation-iteration-count: infinite;
  animation-timing-function: ease-in-out;
  visibility: visible !important;
}

.double {
  animation: wobbling_x 3s ease-in-out infinite alternate, wobbling_y 3.5s ease-in-out infinite alternate;
}

.wobbling {
  animation: wobbling 3s ease-in-out infinite alternate;
}

.wobbling_x {
  animation: wobbling_x 3s ease-in-out infinite alternate;
}

/*----------------------------------------------------------------
	スクロールアニメーション
----------------------------------------------------------------*/
.lozad-in {
  opacity: 0;
  transition: opacity 1s ease-in-out;
}

.lozad-in[data-loaded=true] {
  opacity: 1;
}

.lozad-up {
  opacity: 0;
  transform: translate3d(0, 40px, 0);
  transition: all 1s ease-in-out;
}

.lozad-up[data-loaded=true] {
  opacity: 1;
  transform: translate3d(0, 0, 0);
}

.lozad-lftSlideIn {
  opacity: 0;
  transform: translate3d(-100px, 0, 0);
  transition: all 1s ease-in-out;
}

.lozad-lftSlideIn[data-loaded=true] {
  opacity: 1;
  transform: translate3d(0, 0, 0);
}

.lozad-lftSlideIn02 {
  opacity: 0;
  transform: translate3d(-50%, 0, 0);
  transition: all 1.5s ease-in-out;
}

.lozad-lftSlideIn02[data-loaded=true] {
  opacity: 1;
  transform: translate3d(0, 0, 0);
}

.lozad-rhtSlideIn {
  opacity: 0;
  transform: translate3d(100px, 0, 0);
  transition: all 1s ease-in-out;
}

.lozad-rhtSlideIn[data-loaded=true] {
  opacity: 1;
  transform: translate3d(0, 0, 0);
}

.lozad-fadeup > .lozad-fadeupin {
  opacity: 0;
  transform: translate3d(0, 40px, 0);
}

.lozad-fadeup[data-loaded=true] > .lozad-fadeupin {
  transition: 0.6s ease-in-out;
  transform: translate3d(0, 0, 0);
  opacity: 1;
}

.lozad-fadeup[data-loaded=true] > .lozad-fadeupin:nth-child(2) {
  transition-delay: 0.4s;
}

.lozad-fadeup[data-loaded=true] > .lozad-fadeupin:nth-child(3) {
  transition-delay: 0.6s;
}

.lozad-fadeup[data-loaded=true] > .lozad-fadeupin:nth-child(4) {
  transition-delay: 0.8s;
}

.lozad-fadeup[data-loaded=true] > .lozad-fadeupin:nth-child(5) {
  transition-delay: 1s;
}

.lozad-fadeup[data-loaded=true] > .lozad-fadeupin:nth-child(6) {
  transition-delay: 1.2s;
}

.lozad-fadeup[data-loaded=true] > .lozad-fadeupin:nth-child(7) {
  transition-delay: 1.4s;
}

.lozad-fadeup[data-loaded=true] > .lozad-fadeupin:nth-child(8) {
  transition-delay: 1.6s;
}

.lozad-fadeup[data-loaded=true] > .lozad-fadeupin:nth-child(9) {
  transition-delay: 1.8s;
}

.lozad-rhtIn > .lozad-rhtInto {
  opacity: 0;
  transform: translate3d(-100px, 0, 0);
}

.lozad-rhtIn[data-loaded=true] > .lozad-rhtInto {
  transform: translate3d(0, 0, 0);
  opacity: 1;
  transition: 0.6s ease-in-out;
}

.lozad-rhtIn[data-loaded=true] > .lozad-rhtInto:nth-child(2) {
  transition-delay: 0.4s;
}

.lozad-rhtIn[data-loaded=true] > .lozad-rhtInto:nth-child(3) {
  transition-delay: 0.6s;
}

.lozad-rhtIn[data-loaded=true] > .lozad-rhtInto:nth-child(4) {
  transition-delay: 0.8s;
}

.lozad-rhtIn[data-loaded=true] > .lozad-rhtInto:nth-child(5) {
  transition-delay: 1s;
}

.lozad-rhtIn[data-loaded=true] > .lozad-rhtInto:nth-child(6) {
  transition-delay: 1.2s;
}

.lozad-cnt04 > .lozad-cnt04in {
  opacity: 0;
  transform: translate3d(0, 40px, 0);
}

.lozad-cnt04[data-loaded=true] > .lozad-cnt04in {
  transition: 0.6s ease-in-out;
  transform: translate3d(0, 0, 0);
  transition-delay: 0.4s;
  opacity: 1;
}

.lozad-cnt04[data-loaded=true] > .lozad-cnt04in.num2 {
  transition-delay: 0.8s;
}

.lozad-cnt04[data-loaded=true] > .lozad-cnt04in.num3 {
  transition-delay: 1.6s;
}

.lozad-cnt08.lozad-fadeup[data-loaded=true] > .lozad-fadeupin {
  transition-delay: 0.8s;
}
.lozad-cnt08.lozad-fadeup[data-loaded=true] > .lozad-fadeupin:nth-child(2) {
  transition-delay: 1.2s;
}

.lozad-cnt10.lozad-up[data-loaded=true] {
  transition-delay: 1.2s;
}

/*---------------------------------------------------------------
  introduction
---------------------------------------------------------------*/
#inner {
  overflow-x: hidden;
}

#intro {
  position: relative;
  padding: 35px 0 0;
  min-height: 1000px;
  background-image: url(../images/furisode/intro/intro-bg.png);
  background-position: bottom center;
  background-size: cover;
}
@media screen and (max-width: 599px) {
  #intro {
    min-height: 100vh;
    background-image: url(../images/furisode/intro/sp/intro-bg.png);
  }
}
#intro .decoArea {
  z-index: 2;
}
#intro .deco {
  left: auto;
  right: 10%;
  z-index: 10;
}
#intro .deco.deco04 {
  max-width: 18%;
  left: auto;
  right: 15%;
  top: -21%;
  animation: fadeRotateIn02 1.5s ease-in-out 0s forwards, wobbling02 5s ease-in-out 1.5s infinite alternate;
}
#intro .deco.deco05 {
  width: 8%;
  right: 5%;
  top: 30px;
  animation: floater 3s ease-in-out infinite alternate;
}
#intro .deco.deco01 {
  right: auto;
  left: 5%;
  top: 5%;
  animation: wobbling 3s ease-in-out infinite alternate;
}
#intro .catchArea {
  position: absolute;
  top: 60px;
  width: 100%;
  text-align: center;
}
#intro .catchArea .obi {
  position: absolute;
  bottom: 0;
  opacity: 0;
  transform: translate3d(-50%, 0, 0) scale(0.5);
  transition: all 0.8s ease-in-out;
}
#intro .catchArea .obi[data-loaded=true] {
  opacity: 1;
  transform: translate3d(0, 0, 0) scale(1);
}
#intro .catchArea .subcatch {
  width: 15%;
  margin: 0 auto;
  opacity: 0;
}
#intro .catchArea .subcatch img {
  width: 100%;
}
#intro .catchArea .catch {
  width: 55%;
  margin: 100px 0 0 0;
  opacity: 0;
  transform: scale(2);
  z-index: 11;
}
#intro .catchArea .catch img {
  width: 100%;
}
#intro .catchArea .catch-woman {
  width: 45%;
  position: relative;
  bottom: 217px;
}
#intro .catchArea .catch-woman img {
  width: 100%;
}
#intro .catchArea[data-loaded=true] .subcatch {
  opacity: 1;
  transition: 0.6s ease-in-out 0.5s;
}
#intro .catchArea[data-loaded=true] .catch {
  opacity: 1;
  transform: scale(1);
  transition: 0.6s ease-in-out 0.5s;
}

@media screen and (max-width: 960px) {
  #intro .catchArea {
    top: 0;
  }
  #intro .catchArea .subcatch {
    width: 40%;
  }
  #intro .catchArea .catch {
    width: 90%;
    margin-left: auto;
    margin-right: auto;
    margin-top: 0;
  }
}
@media screen and (max-width: 960px) {
  #intro .catchArea {
    top: 0;
  }
  #intro .catchArea .subcatch {
    width: 40%;
  }
  #intro .catchArea .catch {
    width: 90%;
    margin-left: auto;
    margin-right: auto;
    margin-top: 0;
  }
}
/*---------------------------------------------------------------
　Point01
---------------------------------------------------------------*/
#point01 {
  position: relative;
}
#point01 .heading02 {
  max-width: 1000px;
  margin: 0 auto;
}
@media screen and (max-width: 960px) {
  #point01 .heading02 img {
    width: 100%;
  }
}
#point01 h3 {
  margin-top: 70px;
  margin-bottom: 50px;
  text-align: center;
}
@media screen and (max-width: 960px) {
  #point01 h3 {
    width: 50%;
    margin: 40px auto;
  }
}
#point01 .flex .cntLft {
  width: 75%;
  padding-right: 60px;
}
@media screen and (max-width: 960px) {
  #point01 .flex .cntLft {
    width: 100%;
    padding-right: 0;
    margin-bottom: 20px;
  }
}
#point01 .flex .img {
  width: 25%;
}
@media screen and (max-width: 960px) {
  #point01 .flex .img {
    width: 70%;
    margin-left: auto;
    margin-right: auto;
  }
}
#point01 .decoArea .deco {
  width: 15%;
  left: 5%;
  top: -50px;
}
#point01 .decoArea .deco.deco01 {
  animation: fadeIn 2.2s ease-in-out forwards;
}
#point01 .decoArea .deco.deco02 {
  width: 5%;
  left: 35%;
  top: 1%;
  animation: fadeIn 1.5s ease-in-out 0s forwards;
}
#point01 .decoArea .deco.deco03 {
  width: 8%;
  left: auto;
  right: 5%;
  top: 5%;
  animation: fadeIn 1.5s ease-in-out 0s forwards;
}

/*---------------------------------------------------------------
　Point02
---------------------------------------------------------------*/
#point02 {
  margin-top: 80px;
  text-align: center;
}
#point02 .heading02 {
  max-width: 1000px;
  margin: 0 auto 70px;
  padding-right: 80px;
}
#point02 #ticker {
  margin-top: 60px;
}
#point02 #ticker .slider .slick-slide {
  padding: 0 3px;
}
@media screen and (max-width: 1024px) {
  #point02 .txt {
    text-align: left;
  }
}
@media screen and (max-width: 960px) {
  #point02 {
    margin-top: 50px;
  }
  #point02 .heading02 {
    padding-right: 0;
    margin-bottom: 50px;
  }
  #point02 .heading02 img {
    width: 320px;
  }
}

/*---------------------------------------------------------------
　Point03
---------------------------------------------------------------*/
#point03 {
  margin-top: 80px;
}
#point03 .heading02 {
  margin-bottom: 70px;
}
#point03 .staffTxt {
  width: 300px;
  margin: 50px auto;
}
#point03 .staffList {
  display: flex;
  flex-wrap: wrap;
  justify-content: center;
}
#point03 .staffList li {
  width: 16.6666666667%;
  text-align: center;
  margin-bottom: 40px;
}
#point03 .staffList li .img {
  width: 180px;
  height: 180px;
  margin: 0 auto 20px;
}
#point03 .staffList li .img img {
  -o-object-fit: cover;
     object-fit: cover;
  width: 100%;
  height: 100%;
  border-radius: 50%;
}
#point03 .staffArea {
  margin-top: 70px;
  position: relative;
}
#point03 .staffArea .staffTxt {
  position: absolute;
  top: -40px;
  left: 50%;
  transform: translateX(-30%);
  width: 20%;
}
@media screen and (max-width: 1024px) {
  #point03 .wrap > .txt {
    text-align: left;
  }
  #point03 .wrap .staffList li {
    padding-left: 5px;
    padding-right: 5px;
  }
  #point03 .wrap .staffList li .img {
    width: 100%;
    height: auto;
  }
}
@media screen and (max-width: 960px) {
  #point03 {
    margin-top: 50px;
  }
  #point03 .heading02 {
    margin-bottom: 50px;
    padding-right: 30px;
  }
  #point03 .heading02 img {
    width: 280px;
  }
  #point03 .staffTxt {
    margin: 30px auto;
  }
}
@media screen and (max-width: 599px) {
  #point03 .staffList li {
    width: 33.3333333333%;
    margin-bottom: 20px;
  }
  #point03 .staffList li .img {
    margin-bottom: 10px;
  }
}

/*---------------------------------------------------------------
　Point04
---------------------------------------------------------------*/
#point04 {
  margin-top: 80px;
}
#point04 .heading02 {
  max-width: 800px;
  margin: 0 auto 70px;
  padding-right: 80px;
}
#point04 .img {
  margin-top: 70px;
}
@media screen and (max-width: 960px) {
  #point04 {
    margin-top: 40px;
  }
  #point04 .heading02 {
    margin-bottom: 40px;
    padding-right: 0;
    padding-right: 30px;
  }
  #point04 .heading02 img {
    width: 250px;
  }
  #point04 .img {
    margin-top: 40px;
  }
}

/*---------------------------------------------------------------
 Popular
---------------------------------------------------------------*/
#privilege .wrap .priOuter .priBox .popular__inner.inner {
  padding: 100px 4% 80px;
}

@media screen and (max-width: 960px) {
  #privilege .wrap .priOuter .priBox .popular__inner.inner {
    padding: 20px 4% 60px;
  }
}
.popular__inner.wrap02 {
  max-width: 900px;
  width: 100%;
}

.popular__batch {
  position: absolute;
  z-index: 1;
  width: 23%;
  top: -98px;
  left: -103px;
}

@media screen and (max-width: 960px) {
  .popular__batch {
    width: 20%;
    top: -30px;
    left: -28px;
  }
}
.popular__title {
  max-width: 906px;
  width: 100%;
  margin: auto;
}

.popular__album-item-flex {
  display: flex;
  justify-content: space-between;
  width: calc(100% - 10px);
}

@media screen and (max-width: 960px) {
  .popular__album-item-flex {
    display: block;
  }
}
.popular__album-item.popular__album-item--flex-item {
  width: calc(47.8% - 10px);
}

@media screen and (max-width: 960px) {
  .popular__album-item.popular__album-item--flex-item {
    width: 100%;
  }
}
.popular__album-item {
  position: relative;
  background: #fff;
  border: 1px solid #000;
  border-radius: 10px;
  padding: 60px 45px 32px;
  width: calc(100% - 10px);
  height: 100%;
  margin-top: 68px;
}

@media screen and (max-width: 960px) {
  .popular__album-item {
    padding: 30px 20px 30px;
  }
}
.popular__album-item.popular__album-item--chirimen {
  margin-top: 143px;
}

@media screen and (max-width: 960px) {
  .popular__album-item.popular__album-item--chirimen {
    margin-top: 60px;
  }
}
.popular__album-item::after {
  width: 100%;
  height: 100%;
  background: #ffff00;
  position: absolute;
  content: "";
  bottom: -10px;
  right: -10px;
  border: 1px solid #000;
  border-radius: 10px;
  z-index: -1;
}

.popular__album-title {
  position: absolute;
  top: -20px;
  left: 50%;
  transform: translate(-50%);
  width: 100%;
}

.popular__album-title.popular__album-title--chirimen {
  max-width: 333px;
}

.popular__album-title.popular__album-title--digital {
  max-width: 395px;
}

.popular__album-title.popular__album-title--noble {
  max-width: 329px;
}

.popular__album-title.popular__album-title--square {
  max-width: 335px;
}

@media screen and (max-width: 960px) {
  .popular__album-title.popular__album-title--chirimen {
    width: 79%;
  }
  .popular__album-title.popular__album-title--digital {
    width: 93.7%;
  }
  .popular__album-title.popular__album-title--noble {
    width: 78.1%;
  }
  .popular__album-title.popular__album-title--square {
    width: 79.5%;
  }
}
.popular__flip-page {
  max-width: 800px;
  width: 100%;
}

.popular__flip-page-wrapper {
  position: relative;
  width: 100%;
}

.popular__flip-page-wrapper::before {
  content: "";
  display: block;
  padding-top: 70.75%;
}

.popular__flip-page-wrapper img {
  position: absolute;
  top: 50%;
  left: 50%;
  transform: translate(-50%, -50%);
  width: 100%;
  height: 100%;
  -o-object-fit: cover;
     object-fit: cover;
}

.popular__album-description-wrapper {
  margin-top: 86px;
}

.popular__album-description-wrapper.popular__album-description-wrapper--square {
  margin-top: 0;
}

.popular__album-description {
  font-size: 1.25rem;
  line-height: 1.6;
  letter-spacing: 0.05em;
}

@media screen and (max-width: 960px) {
  .popular__album-description {
    font-size: 0.875rem;
  }
}
.popular__album-info {
  margin-top: 17px;
}

.popular__album-info.popular__album-info--chirimen {
  display: flex;
  justify-content: space-between;
}

@media screen and (max-width: 960px) {
  .popular__album-info.popular__album-info--chirimen {
    flex-direction: column;
  }
}
/* 既存のdivタグの::afterの指定を上書き削除 ---- */
.popular__album-info::after,
.popular__album-item-flex::after {
  content: none;
}

/* 既存のdivタグの::afterの指定を上書き削除 ここまで ---- */
.popular__album-spec-text {
  font-size: 18px;
  line-height: 2;
  letter-spacing: 0.05em;
}

@media screen and (max-width: 960px) {
  .popular__album-spec-text {
    font-size: 1rem;
  }
}
.popular__album-spec-text.popular__album-spec-text--chirimen {
  font-size: 1rem;
}

@media screen and (max-width: 960px) {
  .popular__album-spec-text.popular__album-spec-text--chirimen {
    font-size: 0.875rem;
  }
}
.popular__album-price-wrapper {
  margin-left: auto;
  margin-top: 13px;
  width: -moz-max-content;
  width: max-content;
}

.popular__album-price-wrapper.popular__album-price-wrapper--chirimen {
  margin-top: 0;
}

@media screen and (max-width: 960px) {
  .popular__album-price-wrapper.popular__album-price-wrapper--chirimen {
    margin-left: auto;
    margin-top: 13px;
    width: -moz-max-content;
    width: max-content;
  }
}
@media screen and (max-width: 960px) {
  .popular__album-description-wrapper.popular__album-description-wrapper--digital,
  .popular__album-description-wrapper.popular__album-description-wrapper--noble {
    margin-top: 30px;
  }
}
.popular__album-page {
  font-size: 1.5rem;
  letter-spacing: 0.05em;
  line-height: 1.5833333333;
}

@media screen and (max-width: 960px) {
  .popular__album-page {
    font-size: 1rem;
  }
}
.popular__album-price {
  font-size: 30px;
  letter-spacing: 0.05em;
  line-height: 1.6;
  margin-top: 2px;
  text-align: left;
}

@media screen and (max-width: 960px) {
  .popular__album-price {
    font-size: 1.3rem;
  }
}
.popular__album-price span {
  font-size: 20px;
  letter-spacing: 0.05em;
  line-height: 1.6;
  text-align: right;
}

@media screen and (max-width: 960px) {
  .popular__album-price span {
    font-size: 13px;
  }
}
.popular__album-item-wrapper {
  display: flex;
}

@media screen and (max-width: 960px) {
  .popular__album-item-wrapper {
    flex-direction: column-reverse;
  }
}
.popular__album-item-text-area {
  width: 42.8%;
}

@media screen and (max-width: 960px) {
  .popular__album-item-text-area {
    width: 100%;
  }
}
.popular__album-image.popular__album-image--digital,
.popular__album-image.popular__album-image--noble {
  position: relative;
  width: 100%;
}

.popular__album-image.popular__album-image--digital::before,
.popular__album-image.popular__album-image--noble::before {
  content: "";
  display: block;
  padding-top: 64.1176470588%;
}

.popular__album-image.popular__album-image--digital img,
.popular__album-image.popular__album-image--noble img {
  position: absolute;
  top: 50%;
  left: 50%;
  transform: translate(-50%, -50%);
  width: 100%;
  height: 100%;
  -o-object-fit: cover;
     object-fit: cover;
}

.popular__album-image-wrapper {
  width: 52.3%;
  margin-left: 4.9%;
}

@media screen and (max-width: 960px) {
  .popular__album-image-wrapper {
    width: 100%;
    margin-left: 0;
  }
}
.popular__album-image.popular__album-image--square {
  position: relative;
  width: 100%;
}

.popular__album-image.popular__album-image--square::before {
  content: "";
  display: block;
  padding-top: 74.0566037736%;
}

.popular__album-image.popular__album-image--square img {
  position: absolute;
  top: 50%;
  left: 50%;
  transform: translate(-50%, -50%);
  width: 100%;
  height: 100%;
  -o-object-fit: cover;
     object-fit: cover;
}

.popular__slider .slick-list {
  border-radius: 9.92px;
  border: 1px solid #000;
}

.popular__slide-wrapper .slick-img {
  position: relative;
  width: 100%;
}

.popular__slide-wrapper .slick-img::before {
  content: "";
  display: block;
  padding-top: 70.75%;
}

.popular__slide-wrapper .slick-img img {
  position: absolute;
  top: 50%;
  left: 50%;
  transform: translate(-50%, -50%);
  width: 100%;
  height: 100%;
  -o-object-fit: cover;
     object-fit: cover;
}

.popular__slide-wrapper .slide-arrow {
  background-color: #333;
  bottom: 0;
  height: 0;
  margin: auto;
  position: absolute;
  top: 0;
  width: 0;
}

.popular__slide-wrapper .prev-arrow {
  border-bottom: 10px solid #333;
  border-left: 0;
  border-right: 10px solid #fff;
  border-top: 10px solid #333;
  left: -25px;
}

.popular__slide-wrapper .next-arrow {
  border-bottom: 10px solid #333;
  border-left: 10px solid #fff;
  border-right: 0;
  border-top: 10px solid #333;
  right: -25px;
}

.popular__slide-wrapper button {
  -webkit-appearance: none;
  -moz-appearance: none;
  appearance: none;
  outline: none;
  padding: 0;
}

.popular__slide-wrapper .slick-prev,
.popular__slide-wrapper .slick-next {
  top: auto;
  bottom: -12%;
  bottom: -66px;
}

.popular__slide-wrapper .slick-prev,
.popular__slide-wrapper .slick-next {
  width: 40px;
  height: 40px;
}

.popular__slide-wrapper .slick-prev {
  left: calc(50% - 30px);
  transform: translateX(-50%);
}

.popular__slide-wrapper .slick-next {
  left: calc(50% + 30px);
  transform: translateX(-50%);
}

.popular__slide-wrapper .slick-prev::before,
.popular__slide-wrapper .slick-next::before {
  content: "";
  background-repeat: no-repeat;
  background-size: contain;
  margin: auto;
  width: 100%;
  height: 100%;
  display: inline-block;
}

.popular__slide-wrapper .slick-prev::before {
  background-image: url(../images/furisode/popular/arrow-left.png);
}

.popular__slide-wrapper .slick-next::before {
  background-image: url(../images/furisode/popular/arrow-right.png);
}

/*---------------------------------------------------------------
　Type
---------------------------------------------------------------*/
#type {
  margin-top: 80px;
  background: url(../images/furisode/type/type-bg.jpg) no-repeat center top;
  position: relative;
  z-index: 2;
}
#type::before, #type::after {
  position: absolute;
  content: "";
  top: -1px;
  width: 50%;
  height: 200px;
  left: 1px;
  background: #FFF;
  -webkit-clip-path: polygon(0 0, 100% 0, 100% 100%, 0 29%);
          clip-path: polygon(0 0, 100% 0, 100% 100%, 0 29%);
  z-index: -1;
}
#type::after {
  right: 1px;
  left: auto;
  -webkit-clip-path: polygon(0 0, 100% 0, 100% 29%, 0 100%);
          clip-path: polygon(0 0, 100% 0, 100% 29%, 0 100%);
  z-index: -1;
}
#type .h2Area {
  max-width: 800px;
  margin: 0 auto;
}
#type .h2Area .subH2 {
  max-width: 30%;
  margin: 0 auto;
}
#type .h2Area .heading02 {
  margin-top: -80px;
}
#type .imgArea {
  height: 720px;
}
#type .imgArea .type-img {
  margin-top: -40px;
}
#type .imgArea .type-img img {
  max-width: 900px;
}
#type .typeBox {
  position: relative;
  margin-top: 55px;
}
#type .typeBox .typeDeco {
  width: 120px;
  position: absolute;
  top: -160px;
  right: 5%;
}
#type .typeBox .typeList li {
  cursor: pointer;
  transform: scale(1);
  transition: transform 0.3s ease-in;
}
#type .typeBox .typeList li:hover {
  transform: scale(1.05);
}
#type .typeBox .typeList li.current {
  transform: scale(1.05);
}
#type .typeBox .typeList li.classic img {
  margin-top: 10px;
  margin-bottom: 10px;
}
#type .typeBox .typeList li.gorgeous img {
  margin-top: 10px;
  margin-bottom: 5px;
}
#type .typeBox .typeList li.gorgeous .txt {
  margin-top: 0;
}
#type .typeBox .typeList li.retro img {
  margin-top: 10px;
  margin-bottom: 10px;
}
#type .typeBox .typeList li.girly img {
  margin-top: 10px;
  margin-bottom: 5px;
}
#type .typeBox .typeList li.girly .txt {
  margin-top: 0;
}
#type .typeBox .typeList li.originality img {
  margin-top: 10px;
  margin-bottom: 5px;
}
#type .typeBox .typeList li.originality .txt {
  margin-top: 0;
}
@media screen and (max-width: 960px) {
  #type {
    background-size: 200% auto;
    margin-top: 40px;
  }
  #type .wrap {
    padding: 0;
  }
  #type::before, #type::after {
    height: 80px;
    left: 1px;
    background: #FFF;
    -webkit-clip-path: polygon(0 0, 100% 0, 100% 100%, 0 29%);
            clip-path: polygon(0 0, 100% 0, 100% 100%, 0 29%);
    z-index: -1;
  }
  #type::after {
    right: 1px;
    left: auto;
    -webkit-clip-path: polygon(0 0, 100% 0, 100% 29%, 0 100%);
            clip-path: polygon(0 0, 100% 0, 100% 29%, 0 100%);
    z-index: -1;
  }
  #type .h2Area {
    max-width: 90%;
  }
  #type .h2Area .subH2 {
    max-width: 40%;
  }
  #type .h2Area .heading02 {
    margin-top: -20px;
  }
  #type .imgArea {
    height: 400px;
    overflow: hidden;
  }
  #type .imgArea .type-img {
    margin-top: 0;
  }
  #type .imgArea .type-img img {
    max-width: 120%;
    margin-left: -10%;
  }
  #type .typeBox {
    margin-top: 0;
    padding-left: 2%;
    padding-right: 2%;
    padding-bottom: 20px;
  }
  #type .typeBox .typeDeco {
    width: 70px;
    position: absolute;
    top: -80px;
    right: 5%;
  }
  #type .typeBox .typeList li {
    cursor: pointer;
    transform: scale(1);
    transition: transform 0.3s ease-in;
  }
  #type .typeBox .typeList li .titleArea {
    width: 65px;
    height: 50px;
    top: -35px;
  }
  #type .typeBox .typeList li .titleArea .enSub {
    width: 60%;
  }
  #type .typeBox .typeList li .titleArea .txt {
    font-size: 0.6rem;
    margin-top: 0;
  }
  #type .typeBox .typeList li.originality img {
    width: 100%;
  }
  #type .typeBox .typeList li.originality .txt {
    margin-top: -4px;
    margin-bottom: 4px;
  }
  #type .typeBox .typeList li.girly .txt {
    margin-top: -8px;
    margin-bottom: 8px;
  }
  #type .typeBox .typeList li.gorgeous .txt {
    margin-top: -4px;
    margin-bottom: 4px;
  }
  #type .typeBox .typeList li + li {
    margin-left: 2px;
  }
}

/*---------------------------------------------------------------
 Privilege
---------------------------------------------------------------*/
#privilege {
  background-color: #fffa76;
  background-image: url(../images/furisode/privilege/privilege-bg.png);
  background-repeat: no-repeat;
  background-position: top center;
  padding: 100px 0 140px;
  margin-top: 185px;
}
#privilege .h2Area {
  padding-left: 5%;
  padding-right: 5%;
  margin-bottom: 20px;
}
#privilege .h2Area .subH2 {
  max-width: 60%;
  margin: 0 auto 50px;
}
#privilege .priBox .inner {
  position: relative;
  width: calc(100% - 10px);
}
#privilege .priBox .inner::after {
  width: 100%;
  right: -10px;
}
#privilege .priBox .inner .sub-txt {
  font-size: 0.875rem;
}
#privilege .priBox .inner .num {
  position: absolute;
  width: 125px;
  height: 120px;
  display: flex;
  align-items: center;
  justify-content: center;
  flex-direction: column;
  padding-right: 5px;
  top: -70px;
  left: 50%;
  transform: translateX(-50%);
}
#privilege .priBox .inner .num .number {
  font-size: 2.5rem;
  line-height: 1;
}
#privilege .priBox .inner .num .bgImg img {
  -o-object-fit: contain;
     object-fit: contain;
}
@media screen and (max-width: 599px) {
  #privilege .priBox .inner .num {
    width: 60px;
    height: 60px;
  }
  #privilege .priBox .inner .num p {
    font-size: 0.75rem;
  }
  #privilege .priBox .inner .num .number {
    font-size: 1.125rem;
  }
}
#privilege .wrap .privilegeList {
  margin-top: 105px;
  margin-bottom: 100px;
  counter-reset: number 0;
  display: flex;
  flex-wrap: wrap;
}
#privilege .wrap .privilegeList .priBox {
  text-align: center;
}
#privilege .wrap .privilegeList li {
  width: calc((100% - 60px) / 3);
  margin-right: 30px;
  margin-bottom: 45px;
}
#privilege .wrap .privilegeList li:nth-child(3n) {
  margin-right: 0;
}
#privilege .wrap .privilegeList .number::before {
  counter-increment: number 1;
  content: counter(number) " ";
}
#privilege .wrap .priOuter .priBox .inner {
  padding: 100px 4% 60px;
}
#privilege .wrap .priOuter .priBox .inner .subheading {
  margin: 40px auto;
  max-width: 85%;
}
#privilege .wrap .priOuter .priBox .inner .sub-txt {
  font-size: 1.125rem;
  text-align: center;
  color: #000000;
  margin-bottom: 20px;
}
#privilege .wrap .priOuter .priBox .inner .sub-txt span {
  font-size: 0.875rem;
}
#privilege .wrap .priOuter .priBox .inner .marker {
  font-weight: normal;
}
#privilege .wrap .priOuter .priBox .inner .pri02 {
  padding-left: 7%;
  align-items: flex-end;
}
#privilege .wrap .priOuter .priBox .inner .pri02 .heading03 {
  margin-bottom: 30px;
}
#privilege .wrap .priOuter .priBox .inner .pri02 .cntLft {
  width: 62%;
}
#privilege .wrap .priOuter .priBox .inner .pri02 .cntLft .setList {
  display: flex;
  align-items: flex-end;
  text-align: left;
  border-bottom: 1px solid #000;
  padding-bottom: 20px;
  max-width: 580px;
  position: relative;
}
#privilege .wrap .priOuter .priBox .inner .pri02 .cntLft .setList::after {
  position: absolute;
  width: 45%;
  height: 1px;
  content: "";
  background: #000;
  bottom: -1px;
  right: -45%;
  transform: rotate(-45deg);
  transform-origin: 0% 100%;
}
#privilege .wrap .priOuter .priBox .inner .pri02 .cntLft .setList + .setList {
  margin-top: 30px;
}
#privilege .wrap .priOuter .priBox .inner .pri02 .cntLft .setList .inRht {
  width: 186px;
  margin-left: -90px;
}
#privilege .wrap .priOuter .priBox .inner .pri02 .cntLft .setList .inLft {
  width: calc(100% - 105px);
  max-width: 450px;
}
#privilege .wrap .priOuter .priBox .inner .pri02 .cntLft .setList .inLft .title {
  font-size: 1.5rem;
  font-weight: bold;
}
#privilege .wrap .priOuter .priBox .inner .pri02 .cntLft .setList .inLft .txt {
  line-height: 1;
}
#privilege .wrap .priOuter .priBox .inner .pri02 .cntLft .setList .inLft .txt span {
  font-size: 1.75rem;
  font-weight: bold;
}
#privilege .wrap .priOuter .priBox .inner .pri02 .cntLft .setList:nth-child(3)::after {
  width: 62%;
  right: -62%;
  transform: rotate(-59deg);
}
#privilege .wrap .priOuter .priBox .inner .pri02 .cntLft .setList:nth-child(4)::after {
  width: 75%;
  right: -75%;
  transform: rotate(-66deg);
}
#privilege .wrap .priOuter .priBox .inner .pri02 .cntLft .setList:nth-child(5)::after {
  width: 89%;
  right: -89%;
  transform: rotate(-70deg);
}
#privilege .wrap .priOuter .priBox .inner .pri02 .img {
  width: 45%;
  margin-right: -20%;
}
@media screen and (max-width: 1200px) {
  #privilege .wrap .priOuter .priBox .inner > .heading03.pc-none {
    margin-bottom: 50px;
    text-align: center;
  }
  #privilege .wrap .priOuter .priBox .inner > .heading03.pc-none img {
    width: 80%;
  }
  #privilege .wrap .priOuter .priBox .inner .pri02 {
    padding-left: 0;
    padding-right: 0;
    align-items: center;
  }
  #privilege .wrap .priOuter .priBox .inner .pri02 .cntLft {
    width: 50%;
  }
  #privilege .wrap .priOuter .priBox .inner .pri02 .cntLft .setList .inLft .title {
    margin-bottom: 5px;
  }
  #privilege .wrap .priOuter .priBox .inner .pri02 .cntLft .setList .inLft .txt {
    line-height: 1.4;
  }
  #privilege .wrap .priOuter .priBox .inner .pri02 .img {
    width: 50%;
    text-align: right;
  }
}
#privilege .wrap .priOuter + .priOuter {
  margin-top: 120px;
}
#privilege .wrap .priOuter.priOuter01 .reaction {
  position: absolute;
  bottom: -10%;
  left: -13%;
}
#privilege .wrap .priOuter.priOuter02 .inner {
  padding-right: 3%;
}
#privilege .wrap .priOuter.priOuter02 .reaction {
  position: absolute;
  bottom: -10%;
  right: -8%;
}
#privilege .wrap .priOuter.priOuter05 .num:nth-child(1), #privilege .wrap .priOuter.priOuter03 .num:nth-child(1) {
  transform: translateX(-130px);
}
#privilege .wrap .priOuter.priOuter05 .num:nth-child(2), #privilege .wrap .priOuter.priOuter03 .num:nth-child(2) {
  transform: translateX(30px);
}
#privilege .wrap .priOuter.priOuter05 .wrap02 .flex .cntLft, #privilege .wrap .priOuter.priOuter03 .wrap02 .flex .cntLft {
  width: 70%;
  padding-right: 40px;
}
#privilege .wrap .priOuter.priOuter05 .wrap03, #privilege .wrap .priOuter.priOuter03 .wrap03 {
  max-width: 960px;
  margin-left: auto;
  margin-right: auto;
}
#privilege .wrap .priOuter.priOuter05 .wrap03 .flex .cntRht, #privilege .wrap .priOuter.priOuter03 .wrap03 .flex .cntRht {
  margin-top: 40px;
}
#privilege .wrap .priOuter.priOuter05 .wrap03 .flex .cntLft, #privilege .wrap .priOuter.priOuter03 .wrap03 .flex .cntLft {
  margin-top: 17px;
}
#privilege .wrap .priOuter.priOuter03 .wrap03 h4 {
  margin: 50px 0 40px;
  text-align: center;
}
#privilege .wrap .priOuter.priOuter03 .wrap03 h4 img {
  width: 210px;
}
#privilege .wrap .priOuter.priOuter03 .wrap03 .flex .cntLft {
  width: 43%;
  padding-right: 9px;
}
#privilege .wrap .priOuter.priOuter03 .wrap03 .flex .cntRht {
  width: 60%;
}
#privilege .wrap .priOuter.priOuter03 .txt {
  margin: 40px 0 0;
  padding-left: 90px;
  line-height: 1.8;
}
#privilege .wrap .priOuter.priOuter03 .reaction {
  position: absolute;
  bottom: -10%;
  left: -10%;
}
#privilege .wrap .priOuter.priOuter05 .wrap02 .heading03 {
  margin-bottom: 50px;
}
#privilege .wrap .priOuter.priOuter05 .wrap02 h4 {
  margin-top: 40px;
  margin-bottom: 20px;
  text-align: center;
  font-weight: normal;
}
#privilege .wrap .priOuter.priOuter05 .wrap02 .flex .cntLft {
  width: 43%;
  padding-right: 9px;
}
#privilege .wrap .priOuter.priOuter05 .wrap02 .flex .cntLft .txt {
  padding-right: 40px;
  line-height: 1.8;
  margin-bottom: 40px;
}
#privilege .wrap .priOuter.priOuter05 .wrap02 .flex .cntRht {
  width: 60%;
}
#privilege .wrap .priOuter.priOuter05 .wrap02 .flex .cntRht img {
  width: 100%;
}
#privilege .wrap .priOuter.priOuter05 .wrap02 .flex.mini {
  margin-bottom: 36px;
}
#privilege .wrap .priOuter.priOuter05 .wrap02 .flex.mini .cntLft {
  width: 50%;
  padding-right: 20px;
}
#privilege .wrap .priOuter.priOuter05 .wrap02 .flex.mini .cntRht {
  width: 50%;
  padding-right: 30px;
  padding-top: 60px;
}
#privilege .wrap .priOuter.priOuter05 .wrap02 .takamizo {
  width: 790px;
  margin-top: 60px;
}
#privilege .wrap .priOuter.priOuter05 .wrap02 .takamizo .cntLft {
  width: 30%;
}
#privilege .wrap .priOuter.priOuter05 .wrap02 .takamizo .cntRht {
  width: 70%;
  padding-left: 40px;
}
#privilege .wrap .priOuter.priOuter05 .wrap02 .takamizo .cntRht .ttl {
  position: relative;
  margin-bottom: 30px;
  line-height: 2;
}
#privilege .wrap .priOuter.priOuter05 .wrap02 .takamizo .cntRht .ttl .name {
  font-size: 30px;
}
#privilege .wrap .priOuter.priOuter05 .wrap02 .takamizo .cntRht .ttl .logo {
  position: absolute;
  top: 0;
  right: 40px;
}
#privilege .wrap .priOuter.priOuter05 .wrap02 .takamizo .cntRht .txt {
  line-height: 1.8;
}
#privilege .wrap .priOuter.priOuter05 .reaction {
  position: absolute;
  bottom: 60px;
  right: 5%;
}
#privilege .wrap .priOuter.priOuter03 .wrap02 .flex .heading03 {
  width: 70%;
  padding-right: 40px;
}
#privilege .wrap .priOuter.priOuter06 .priBox .inner {
  padding-top: 80px;
}
#privilege .wrap .priOuter.priOuter06 .heading03 {
  margin-top: -28px;
}
#privilege .wrap .priOuter.priOuter06 .reaction {
  position: absolute;
  bottom: 0;
  left: -25%;
}
#privilege .wrap .priOuter.priOuter08 .priBox .inner {
  padding-top: 80px;
}
#privilege .wrap .priOuter.priOuter08 .heading03 {
  margin-bottom: 30px;
}
#privilege .wrap .priOuter.priOuter08 p {
  text-align: center;
}
#privilege .wrap .priOuter.priOuter08 .reaction {
  position: absolute;
  bottom: 0;
  right: -20%;
  left: inherit;
}
#privilege .wrap > .flex {
  margin-top: 120px;
}
#privilege .wrap > .flex .priOuter {
  width: calc((100% - 55px) / 2);
  margin-top: 0;
  height: 440px;
}
#privilege .wrap > .flex .priOuter + .priOuter {
  margin-left: 55px;
}
#privilege .wrap > .flex .priOuter .priBox {
  height: 100%;
}
#privilege .wrap > .flex .priOuter .priBox .inner {
  height: 100%;
}
#privilege .wrap > .flex .priOuter .priBox .inner .heading03 {
  height: 100%;
  padding-left: 3%;
  padding-right: 3%;
}
#privilege .wrap > .flex .priOuter .priBox .inner .heading03 img {
  height: 100%;
}
@media screen and (max-width: 960px) {
  #privilege {
    padding: 40px 0 60px;
    margin-top: 0;
    overflow: hidden;
  }
  #privilege .priBox .inner .sub-txt {
    font-size: 0.5625rem;
    color: #aaa;
  }
  #privilege .wrap .privilegeList {
    margin-top: 40px;
    margin-bottom: 40px;
  }
  #privilege .wrap .privilegeList li {
    width: calc((100% - 20px) / 3);
    margin-right: 10px;
    margin-bottom: 25px;
  }
  #privilege .wrap .privilegeList li:nth-child(3).priBox .inner, #privilege .wrap .privilegeList li:nth-child(7).priBox .inner {
    padding-top: 35px;
  }
  #privilege .wrap .privilegeList li:nth-child(3).priBox .inner .txt, #privilege .wrap .privilegeList li:nth-child(7).priBox .inner .txt {
    padding-bottom: 10px;
  }
  #privilege .wrap .priOuter.priOuter01 .reaction {
    width: 150px;
  }
  #privilege .wrap .priOuter.priOuter02 .reaction {
    width: 130px;
    bottom: -5%;
    right: 0;
  }
  #privilege .wrap .priOuter.priOuter03 .priBox .inner {
    padding-left: 7%;
    padding-right: 7%;
  }
  #privilege .wrap .priOuter.priOuter03 .reaction {
    width: 130px;
    bottom: -2%;
    right: 0;
  }
  #privilege .wrap .priOuter.priOuter03 .wrap02 .flex .heading03 {
    width: 100%;
    padding-right: 0;
  }
  #privilege .wrap .priOuter.priOuter03 .wrap02 .img {
    width: 60%;
    margin-top: 20px;
    margin-left: auto;
    margin-right: auto;
  }
  #privilege .wrap .priOuter.priOuter03 .wrap03 h4 {
    margin: 20px 0;
  }
  #privilege .wrap .priOuter.priOuter03 .wrap03 h4 img {
    width: 100%;
    margin: 0 auto;
  }
  #privilege .wrap .priOuter.priOuter03 .wrap03 .flex .cntLft {
    width: 100%;
    padding-right: 0;
  }
  #privilege .wrap .priOuter.priOuter03 .wrap03 .flex .cntRht {
    width: 100%;
    margin-top: 5px;
  }
  #privilege .wrap .priOuter.priOuter03 .wrap03 .img {
    width: 90%;
    margin-left: auto;
    margin-right: auto;
  }
  #privilege .wrap .priOuter.priOuter04 .reaction {
    width: 130px;
    bottom: -5%;
    right: 0;
  }
  #privilege .wrap .priOuter.priOuter05 .reaction {
    width: 130px;
    bottom: -20px;
    right: -20px;
  }
  #privilege .wrap .priOuter.priOuter05 .priBox .inner {
    padding-left: 7%;
    padding-right: 7%;
  }
  #privilege .wrap .priOuter.priOuter05 .wrap02 .heading03 {
    margin-bottom: 20px;
  }
  #privilege .wrap .priOuter.priOuter05 .wrap02 .flex .cntLft {
    width: 100%;
    padding-right: 0;
  }
  #privilege .wrap .priOuter.priOuter05 .wrap02 .flex .cntLft .txt {
    padding-right: 0;
    width: 90%;
    margin-left: auto;
    margin-right: auto;
    margin-bottom: 30px;
  }
  #privilege .wrap .priOuter.priOuter05 .wrap02 .flex .cntRht {
    width: 100%;
    padding-right: 0;
  }
  #privilege .wrap .priOuter.priOuter05 .wrap02 .flex.mini {
    width: 90%;
    display: flex;
    margin-left: auto;
    margin-right: auto;
  }
  #privilege .wrap .priOuter.priOuter05 .wrap02 .flex.mini .cntRht {
    padding-top: 40px;
    font-size: 0.8rem;
  }
  #privilege .wrap .priOuter.priOuter05 .wrap02 .flex.mini + .img {
    margin-bottom: 5px;
  }
  #privilege .wrap .priOuter.priOuter05 .wrap02 .flex.takamizo {
    width: 90%;
    margin-left: auto;
    margin-right: auto;
    margin-top: 40px;
  }
  #privilege .wrap .priOuter.priOuter05 .wrap02 .flex.takamizo .cntLft {
    float: left;
    width: 35%;
    margin-right: 20px;
    margin-bottom: 40px;
  }
  #privilege .wrap .priOuter.priOuter05 .wrap02 .flex.takamizo .cntRht {
    padding-left: 0;
  }
  #privilege .wrap .priOuter.priOuter05 .wrap02 .flex.takamizo .cntRht .ttl {
    padding-top: 60px;
    font-size: 0.8rem;
    margin-bottom: 0;
  }
  #privilege .wrap .priOuter.priOuter05 .wrap02 .flex.takamizo .cntRht .ttl .name {
    font-size: 1.2rem;
    display: block;
  }
  #privilege .wrap .priOuter.priOuter05 .wrap02 .flex.takamizo .cntRht .ttl .logo {
    right: 0;
  }
  #privilege .wrap .priOuter.priOuter05 .wrap02 .flex.takamizo .cntRht .ttl .logo img {
    width: 60px;
  }
  #privilege .wrap .priOuter.priOuter05 .wrap02 .flex.takamizo .cntRht .txt {
    padding-right: 80px;
  }
  #privilege .wrap .priOuter.priOuter05 .wrap02 .img {
    width: 90%;
    margin-left: auto;
    margin-right: auto;
  }
  #privilege .wrap .priOuter.priOuter06 .reaction {
    width: 130px;
    bottom: -20px;
    right: inherit;
    left: -80px;
  }
  #privilege .wrap .priOuter.priOuter06 .heading03 {
    margin-bottom: 20px;
  }
  #privilege .wrap .priOuter.priOuter06 .priBox .inner {
    padding-left: 7%;
    padding-right: 7%;
  }
  #privilege .wrap .priOuter.priOuter06 p {
    text-align: center;
  }
  #privilege .wrap .priOuter.priOuter03 .num:nth-child(1), #privilege .wrap .priOuter.priOuter05 .num:nth-child(1), #privilege .wrap .priOuter.priOuter08 .num:nth-child(1) {
    left: 70%;
  }
  #privilege .wrap .priOuter.priOuter03 .num:nth-child(2), #privilege .wrap .priOuter.priOuter05 .num:nth-child(2), #privilege .wrap .priOuter.priOuter08 .num:nth-child(2) {
    left: 44%;
  }
  #privilege .wrap .priOuter.priOuter08 .reaction {
    width: 130px;
    bottom: -20px;
    right: -40px;
    left: inherit;
    padding-right: 0;
  }
  #privilege .wrap .priOuter.priOuter08 .priBox .inner {
    padding-top: 50px;
  }
  #privilege .wrap .priOuter .priBox .inner {
    padding-top: 40px;
    padding-bottom: 40px;
    padding-left: 3%;
    padding-right: 3%;
  }
  #privilege .wrap .priOuter .priBox .inner .subheading {
    margin: 20px auto;
  }
  #privilege .wrap .priOuter .priBox .inner .subheading img {
    width: 100%;
  }
  #privilege .wrap .priOuter .priBox .inner .sub-txt {
    font-size: 0.8125rem;
  }
  #privilege .wrap .priOuter .priBox .inner .sub-txt span {
    font-size: 0.6875rem;
    display: block;
  }
  #privilege .wrap .priOuter .priBox .inner .txt-wrap {
    padding-left: 30%;
  }
  #privilege .wrap .priOuter .priBox .inner .txt-wrap .txt {
    text-align: center;
  }
  #privilege .wrap .priOuter .priBox .inner > .heading03.pc-none {
    margin-bottom: 20px;
  }
  #privilege .wrap .priOuter .priBox .inner > .heading03.pc-none img {
    width: 100%;
  }
  #privilege .wrap .priOuter .priBox .inner .pri02.flex {
    display: flex;
  }
  #privilege .wrap .priOuter .priBox .inner .pri02 .cntLft {
    padding-left: 6%;
  }
  #privilege .wrap .priOuter .priBox .inner .pri02 .cntLft .setList {
    border-bottom: 0;
    padding-bottom: 0;
    display: block;
    position: relative;
  }
  #privilege .wrap .priOuter .priBox .inner .pri02 .cntLft .setList::after {
    content: none;
  }
  #privilege .wrap .priOuter .priBox .inner .pri02 .cntLft .setList .inRht {
    width: 100px;
    margin-left: 0;
  }
  #privilege .wrap .priOuter .priBox .inner .pri02 .cntLft .setList .inLft {
    width: 100%;
    max-width: inherit;
  }
  #privilege .wrap .priOuter .priBox .inner .pri02 .cntLft .setList .inLft .title {
    font-size: 1rem;
  }
  #privilege .wrap .priOuter .priBox .inner .pri02 .cntLft .setList .inLft .txt span {
    font-size: 1.2rem;
  }
  #privilege .wrap .priOuter .priBox .inner .pri02 .cntLft .setList + .setList {
    margin-top: 10px;
  }
  #privilege .wrap .priOuter .priBox .inner .pri02 .img {
    width: 100%;
    margin-top: -90px;
  }
  #privilege .wrap .priOuter + .priOuter {
    margin-top: 60px;
  }
  #privilege .wrap .priBox .inner {
    padding: 30px 10px 10px;
    width: 100%;
  }
  #privilege .wrap .priBox .inner::after {
    right: -6px;
    bottom: -6px;
  }
  #privilege .wrap .priBox .inner .num {
    top: -35px;
  }
  #privilege .wrap .priBox .inner .txt {
    font-size: 0.8rem;
    line-height: 1.6em;
  }
  #privilege .wrap .priBox .inner .heading03 {
    font-size: 1rem;
  }
  #privilege .wrap .priBox .inner .heading03 img {
    width: 100%;
  }
  #privilege .wrap > .flex {
    margin-top: 60px;
  }
  #privilege .wrap > .flex .priOuter {
    width: 100%;
    height: auto;
  }
  #privilege .wrap > .flex .priOuter + .priOuter {
    margin-left: 0;
  }
  #privilege .h2Area .subH2 {
    max-width: 90%;
    margin-bottom: 20px;
  }
  #privilege .heading02 {
    margin-bottom: 40px;
    padding-right: 0;
  }
  #privilege .heading02 img {
    width: 100%;
  }
}

/*---------------------------------------------------------------
 questionnaire
---------------------------------------------------------------*/
#questionnaire {
  padding-top: 100px;
  padding-bottom: 100px;
}
#questionnaire .priBox .inner {
  padding: 45px 20px;
  text-align: center;
}
#questionnaire .priBox .inner::after {
  background: #f3ef2a;
}
#questionnaire .priBox .inner .title {
  font-size: 1.875rem;
}
#questionnaire .priBox .inner .title span {
  font-size: 1.5rem;
}
#questionnaire .priBox .inner .txt {
  font-size: 1.125rem;
}
#questionnaire article + article {
  margin-top: 100px;
}
#questionnaire .q01 {
  position: relative;
}
#questionnaire .q01 .txt {
  word-break: break-all;
}
#questionnaire .q01 .flex {
  margin-top: 50px;
  margin-bottom: 50px;
}
#questionnaire .q01 .flex .wrap03 {
  min-width: 1200px;
}
@media screen and (max-width: 960px) {
  #questionnaire .q01 .flex .wrap03 {
    min-width: inherit;
  }
}
#questionnaire .q01 .flex .graph {
  width: 45%;
}
#questionnaire .q01 .flex .merit {
  width: 36%;
  padding-left: 40px;
}
#questionnaire .q01 .flex .merit .priBox {
  position: relative;
  opacity: 0;
}
#questionnaire .q01 .flex .merit .priBox::before {
  position: absolute;
  content: "";
  width: 80px;
  height: 1px;
  background: #000;
  left: -230px;
  top: 50%;
}
#questionnaire .q01 .flex .merit .priBox::after {
  position: absolute;
  content: "";
  width: 0;
  height: 1px;
  background: #000;
  left: -150px;
  top: 50%;
  transition: all 0.5s ease-in-out;
  transition-delay: 0.4s;
}
#questionnaire .q01 .flex .merit .priBox:first-child::before {
  transform: rotate(-45deg);
  transform-origin: 100% 0%;
}
#questionnaire .q01 .flex .merit .priBox.yellow {
  transition: all 0.5s ease-in-out;
}
#questionnaire .q01 .flex .merit .priBox.yellow[data-loaded=true] {
  opacity: 1;
}
#questionnaire .q01 .flex .merit .priBox.yellow[data-loaded=true]::after {
  width: 150px;
  opacity: 1;
}
#questionnaire .q01 .flex .merit .priBox.green {
  transition: all 0.5s ease-in-out;
  margin-top: 50px;
  width: 80%;
}
#questionnaire .q01 .flex .merit .priBox.green::before {
  transform: rotate(45deg);
  transform-origin: 100% 0%;
  left: -500px;
  width: 50px;
}
#questionnaire .q01 .flex .merit .priBox.green::after {
  width: 0;
  left: -450px;
}
#questionnaire .q01 .flex .merit .priBox.green[data-loaded=true] {
  opacity: 1;
}
#questionnaire .q01 .flex .merit .priBox.green[data-loaded=true]::after {
  width: 450px;
}
#questionnaire .q01 .flex .merit .priBox .title {
  margin-bottom: 20px;
}
#questionnaire .q01 .flex .merit .priBox .txt {
  line-height: 1.7;
}
#questionnaire .q01 .reaction {
  position: absolute;
  bottom: 0;
  right: 0;
}
#questionnaire .other h3 {
  text-align: center;
  margin-bottom: 90px;
}
#questionnaire .other .priBox {
  margin-top: 40px;
}
#questionnaire .other .priBox h4 {
  position: relative;
  margin-top: -80px;
  padding: 0 40px;
}
#questionnaire .other .priBox h4 img {
  position: inherit;
  z-index: 2;
  width: 80%;
}
#questionnaire .other .priBox h4::before {
  position: absolute;
  content: "";
  top: 0;
  left: 20%;
  background: #fff;
  width: 700px;
  height: 60px;
  z-index: 1;
}
@media screen and (max-width: 960px) {
  #questionnaire .other .priBox h4::before {
    width: 100%;
  }
}
#questionnaire .other .priBox h5 {
  margin: 50px 0 60px;
}
#questionnaire .other .priBox .flex {
  max-width: 1000px;
  margin: 0 auto 40px;
}
#questionnaire .other .priBox .cntLft {
  width: 53%;
}
#questionnaire .other .priBox .cntRht {
  width: 47%;
  text-align: left;
  padding-left: 40px;
}
#questionnaire .other .priBox .price-ttl {
  font-size: 24px;
  margin-top: 40px;
}
#questionnaire .other .priBox .price {
  font-size: 30px;
  text-align: right;
  margin-top: 10px;
}
#questionnaire .other .priBox .price span {
  font-size: 20px;
}
#questionnaire .other.other02 .priBox h4::before {
  width: 800px;
  left: 16%;
}
@media screen and (max-width: 960px) {
  #questionnaire .other.other02 .priBox h4::before {
    width: 100%;
  }
}
#questionnaire .other.other02 .priBox-into {
  justify-content: space-between;
  margin-bottom: 80px;
}
#questionnaire .other.other02 dl.inner {
  width: 210px;
  position: relative;
  padding-top: 25px;
}
#questionnaire .other.other02 dl.inner::after {
  width: 210px;
  height: 220px;
  top: 10px;
  left: 10px;
  right: inherit;
}
#questionnaire .other.other02 dl.inner dt {
  margin-bottom: 20px;
}
#questionnaire .other.other02 dl.inner dt img {
  width: 58px;
  height: 20px;
}
#questionnaire .q02 {
  position: relative;
}
#questionnaire .q02 h2 {
  max-width: 690px;
  margin: 0 auto 50px;
}
#questionnaire .q02 .reaction2 {
  position: absolute;
  top: -40px;
  left: -11%;
}
#questionnaire .q02 .reaction3 {
  position: absolute;
  bottom: 40px;
  left: 0;
  z-index: 1;
}
#questionnaire .q02 .priBox-mame .inner {
  padding-left: 60px;
  padding-right: 60px;
}
#questionnaire .q02 .priBox-mame .inner h3 {
  margin-bottom: 30px;
}
#questionnaire .q02 .flex {
  margin-bottom: 70px;
}
#questionnaire .q02 .flex .priBox {
  display: block;
  width: calc((100% - 50px) / 2);
}
#questionnaire .q02 .flex .priBox .inner .price {
  font-size: 2.5rem;
}
#questionnaire .q02 .flex .priBox .inner .price span {
  font-size: 3.75rem;
}
#questionnaire .q02 .flex .priBox + .priBox {
  margin-left: 50px;
}
#questionnaire .q02 .heading03 {
  position: inherit;
  z-index: 2;
  max-width: 420px;
  margin: 120px auto 340px;
}
#questionnaire .q02 .priBox .inner .txt.left {
  text-align: left;
}
#questionnaire .q03 {
  position: relative;
}
#questionnaire .q03 h2 {
  max-width: 645px;
  margin: 0 auto 50px;
}
#questionnaire .q03 .reaction4 {
  position: absolute;
  bottom: 0;
  left: -17%;
  z-index: 3;
}
#questionnaire .q03 .sub {
  max-width: 700px;
  margin: 0 auto 70px;
  text-align: center;
}
#questionnaire .q03 .sub img {
  width: 500px;
}
#questionnaire .q03 .history {
  border-radius: 10px;
  padding: 18px;
  border: 1px solid #000;
  background: rgb(239, 234, 60);
  background: linear-gradient(180deg, rgb(239, 234, 60) 0%, rgb(194, 216, 65) 100%);
}
#questionnaire .q03 .history .histryList {
  position: relative;
}
#questionnaire .q03 .history .histryList::after {
  position: absolute;
  content: "";
  top: -60px;
  left: 50%;
  width: 32px;
  height: 842px;
  background: url(../images/furisode/questionnaire/arrow.svg) no-repeat center top;
}
#questionnaire .q03 .history .histryList li {
  position: inherit;
  z-index: 2;
  border-radius: 10px;
  padding: 35px 30px;
  border: 1px solid #000;
  background: #fff;
  display: flex;
  align-items: center;
  font-size: 1.125rem;
}
#questionnaire .q03 .history .histryList li + li {
  margin-top: 18px;
}
#questionnaire .q03 .history .histryList li p {
  padding-left: 5px;
  padding-right: 5px;
  text-align: center;
  line-height: 1.6;
}
#questionnaire .q03 .history .histryList li p.year {
  font-size: 1.375rem;
  font-weight: bold;
  width: 23%;
  line-height: 1.4;
}
#questionnaire .q03 .history .histryList li p.year span {
  font-size: 3rem;
}
#questionnaire .q03 .history .histryList li p.percent {
  font-size: 1.875rem;
  width: 18%;
  line-height: 1;
}
#questionnaire .q03 .history .histryList li p.percent span {
  font-size: 5.125rem;
}
#questionnaire .q03 .history .histryList li p.tyming {
  width: 23%;
}
#questionnaire .q03 .history .histryList li p.tyming span {
  font-size: 1.625rem;
}
#questionnaire .q03 .history .histryList li p.txt {
  width: 36%;
  text-align: left;
}
#questionnaire .q03 .sup {
  text-align: right;
  margin-top: 30px;
}
@media screen and (max-width: 960px) {
  #questionnaire {
    padding-top: 40px;
    padding-bottom: 60px;
  }
  #questionnaire h2 img {
    width: 100%;
  }
  #questionnaire .priBox .inner {
    padding-top: 20px;
    padding-bottom: 20px;
  }
  #questionnaire .priBox .inner .title {
    font-size: 1.2rem;
  }
  #questionnaire .priBox .inner .txt {
    font-size: 0.8rem;
  }
  #questionnaire .priBox .inner::after {
    right: 4px;
    bottom: -6px;
  }
  #questionnaire .q01 .flex {
    margin-top: 30px;
  }
  #questionnaire .q01 .flex .graph {
    width: 90%;
    margin-left: auto;
    margin-right: auto;
    margin-bottom: 20px;
  }
  #questionnaire .q01 .flex .merit {
    width: 70%;
    padding-left: inherit;
  }
  #questionnaire .q01 .flex .merit .priBox::before, #questionnaire .q01 .flex .merit .priBox::after {
    content: none;
  }
  #questionnaire .q01 .flex .merit .priBox .title {
    margin-bottom: 10px;
  }
  #questionnaire .q01 .flex .merit .priBox.green {
    width: 100%;
    margin-top: 20px;
  }
  #questionnaire .q01 .reaction {
    width: 200px;
    right: -20px;
    bottom: 60px;
  }
  #questionnaire .q01 .txt {
    font-size: 0.7 rem;
  }
  #questionnaire .q02 .reaction2 {
    width: 120px;
    left: 0;
    top: 90px;
  }
  #questionnaire .q02 .flex {
    margin-bottom: 50px;
  }
  #questionnaire .q02 .flex .priBox {
    width: 60%;
    margin-left: auto;
    margin-right: auto;
  }
  #questionnaire .q02 .flex .priBox.yellow {
    margin-bottom: 20px;
  }
  #questionnaire .q02 .flex .priBox + .priBox {
    margin-left: auto;
  }
  #questionnaire .q02 .flex .priBox .inner .title {
    font-size: 1.2rem;
  }
  #questionnaire .q02 .flex .priBox .inner .title span {
    font-size: 1rem;
  }
  #questionnaire .q02 .flex .priBox .inner .price {
    font-size: 1.2rem;
  }
  #questionnaire .q02 .flex .priBox .inner .price span {
    font-size: 1.6rem;
  }
  #questionnaire .q02 .priBox-mame {
    width: 90%;
    margin-left: auto;
    margin-right: auto;
  }
  #questionnaire .q02 .priBox-mame .inner {
    padding-left: 7%;
    padding-right: 7%;
  }
  #questionnaire .q02 .heading03 {
    max-width: 310px;
    margin: 200px auto 40px;
  }
  #questionnaire .q02 .heading03 + .flex {
    margin-bottom: 70px;
  }
  #questionnaire .q02 .heading03 + .flex .priBox {
    width: 80%;
  }
  #questionnaire .q02 .reaction3 {
    bottom: 300px;
  }
  #questionnaire .q03 h2 {
    margin-bottom: 30px;
  }
  #questionnaire .q03 .sub {
    margin-bottom: 40px;
    text-align: center;
  }
  #questionnaire .q03 .sub img {
    width: 280px;
  }
  #questionnaire .q03 .history {
    padding: 5px;
  }
  #questionnaire .q03 .history .histryList li {
    display: block;
    padding: 30px 7%;
  }
  #questionnaire .q03 .history .histryList li p.year {
    width: 100%;
    font-size: 1.3rem;
    margin-bottom: 5px;
  }
  #questionnaire .q03 .history .histryList li p.year br {
    display: none;
  }
  #questionnaire .q03 .history .histryList li p.year span {
    font-size: 1.6rem;
    margin-left: 20px;
  }
  #questionnaire .q03 .history .histryList li p.percent {
    width: 100%;
  }
  #questionnaire .q03 .history .histryList li p.percent span {
    font-size: 3rem;
  }
  #questionnaire .q03 .history .histryList li p.tyming {
    width: 100%;
    margin-bottom: 10px;
  }
  #questionnaire .q03 .history .histryList li p.tyming br {
    display: none;
  }
  #questionnaire .q03 .history .histryList li p.tyming span {
    margin-right: 10px;
  }
  #questionnaire .q03 .history .histryList li p.txt {
    width: 100%;
    font-size: 1rem;
  }
  #questionnaire .q03 .history .histryList li + li {
    margin-top: 5px;
  }
  #questionnaire .q03 .history .histryList li:nth-child(3) p.txt {
    padding-left: 10%;
  }
  #questionnaire .q03 .history .histryList li:nth-child(4) p.txt {
    padding-left: 20%;
  }
  #questionnaire .q03 .history .histryList::before {
    position: absolute;
    content: "";
    left: 47.3%;
    bottom: -2%;
    transform: rotate(-45deg);
    border-left: #000 solid 1px;
    border-bottom: #000 solid 1px;
    width: 20px;
    height: 20px;
  }
  #questionnaire .q03 .history .histryList::after {
    width: 1px;
    height: 104%;
    left: 50%;
    top: -20px;
    background-image: none;
    border-left: #000 solid 1px;
  }
  #questionnaire .q03 .reaction4 {
    width: 130px;
  }
  #questionnaire article + article {
    margin-top: 40px;
  }
  #questionnaire .other h3 {
    margin-bottom: 30px;
  }
  #questionnaire .other .priBox {
    margin-top: 80px;
  }
  #questionnaire .other .priBox .inner {
    padding-left: 7%;
    padding-right: 7%;
  }
  #questionnaire .other .priBox h4 {
    padding-left: 0;
    padding-right: 0;
    margin-top: -55px;
  }
  #questionnaire .other .priBox h4::before {
    left: -3%;
    height: 40px;
    width: 105%;
  }
  #questionnaire .other .priBox h5 {
    margin-top: 30px;
    margin-bottom: 30px;
  }
  #questionnaire .other .priBox .cntLft {
    width: 100%;
    margin-bottom: 30px;
  }
  #questionnaire .other .priBox .cntRht {
    width: 100%;
    padding-left: 0;
  }
  #questionnaire .other .priBox .price-ttl {
    margin-top: 20px;
    font-size: 1rem;
  }
  #questionnaire .other .priBox .price {
    font-size: 1.3rem;
  }
  #questionnaire .other .priBox .price span {
    font-size: 0.8rem;
  }
  #questionnaire .other .priBox .flex {
    margin-bottom: 20px;
  }
  #questionnaire .other.other02 .priBox.flex {
    display: flex;
    flex-wrap: wrap;
    justify-content: center;
  }
  #questionnaire .other.other02 .priBox h4::before {
    left: -3%;
    height: 40px;
    width: 105%;
  }
  #questionnaire .other.other02 .priBox-into .inner {
    padding: 15px 10px 20px;
  }
  #questionnaire .other.other02 dl.inner {
    width: 135px;
    margin-bottom: 15px;
  }
  #questionnaire .other.other02 dl.inner::after {
    width: 135px;
    height: 135px;
    top: 5px;
    left: 5px;
  }
  #questionnaire .other.other02 dl.inner dt {
    margin-bottom: 15px;
  }
  #questionnaire .other.other02 dl.inner dd {
    font-size: 0.8rem;
  }
  #questionnaire .other.other02 dl.inner:nth-child(2n) {
    margin-left: 15px;
  }
}

/*---------------------------------------------------------------
　#select
---------------------------------------------------------------*/
#select .bg {
  background: url(../images/furisode/select/select-img01.png) no-repeat center top;
  background-size: 100% auto;
}
#select h2 {
  text-align: center;
  padding: 120px 0;
}
#select .intro {
  position: relative;
  padding-top: 100px;
  padding-bottom: 180px;
  margin-bottom: 40px;
  background: url(../images/furisode/select/select-bg.png) no-repeat center bottom;
  background-size: 130% auto;
  position: relative;
}
#select .intro::after {
  content: "";
  position: absolute;
  width: 100%;
  bottom: 0;
  box-sizing: border-box;
  border-right: 50vw solid #fff;
  border-left: 50vw solid #fff;
  border-top: 180px solid transparent;
  border-bottom: 10px solid #fff;
}
#select .intro .catch {
  margin-bottom: 50px;
}
#select .intro .txt img {
  width: 280px;
  vertical-align: top;
  margin-left: 10px;
  margin-right: 10px;
}
#select .intro .priBox {
  max-width: 740px;
  margin: 60px auto 0;
}
#select .intro .priBox .inner {
  padding: 50px 80px;
}
#select .stepArea .priBox {
  margin-bottom: 250px;
  position: relative;
}
#select .stepArea .priBox .inner {
  padding: 40px;
}
#select .stepArea .priBox .chach {
  position: absolute;
  z-index: 5;
  bottom: -180px;
  right: 0;
  width: 60%;
}
#select .stepArea .typeList {
  flex-wrap: wrap;
  justify-content: center;
}
#select .stepArea .typeList li {
  width: calc((100% - 15px) / 4);
  margin-bottom: 40px;
}
#select .stepArea .typeList li + li {
  margin-left: 5px;
}
#select .stepArea .typeList li .img {
  width: 100%;
}
#select .stepArea .typeList li .img img {
  -o-object-fit: contain;
     object-fit: contain;
  width: 100%;
}
#select .stepArea .typeList li .inner {
  position: relative;
  margin-bottom: 120px;
}
#select .stepArea .typeList li .inner .titleArea {
  width: 190px;
  height: 190px;
  bottom: -95px;
  top: inherit;
}
#select .stepArea .typeList li .inner .titleArea .enSub {
  width: 80%;
  text-align: center;
  height: 60px;
  display: flex;
  align-items: center;
  justify-content: center;
}
#select .stepArea .typeList li .inner .titleArea .enSub img {
  max-height: 60px;
  max-width: 140px;
}
#select .stepArea .typeList li .inner .titleArea .txt {
  font-size: 1.25rem;
  font-weight: normal;
  line-height: 1.2;
  text-align: center;
}
#select .stepArea .typeList li > .txt {
  padding: 0 15px;
  line-height: 1.8;
}
#select .stepArea .typeList li.sweet .inner .enSub img {
  max-height: 30px;
}
#select .stepArea .typeList li.cool .inner .enSub {
  height: 30px;
}
#select .stepArea .typeList li.cool .inner .enSub img {
  max-height: 30px;
  max-width: 150px;
}
#select .stepBox .h3Area {
  text-align: center;
  margin-bottom: 80px;
}
#select .stepBox .h3Area .sub {
  margin-bottom: 40px;
}
#select .stepBox .h3Area .sub img {
  max-width: 115px;
}
#select .stepBox .h3Area .txt {
  font-size: 1.625rem;
}
#select .stepBox .h3Area h3 {
  margin-top: 20px;
}
#select .stepBox .h3Area h3 img {
  max-width: 75%;
}
#select .stepBox.step01 {
  position: relative;
  margin-bottom: 80px;
}
#select .stepBox.step01 .wrap {
  overflow: hidden;
}
#select .stepBox.step02 .h3Area h3 img {
  max-width: 67%;
}
#select .stepBox.step02 .what {
  text-align: center;
  margin: 70px 0;
}
#select .stepBox.step02 .what .marker {
  line-height: 1.8;
}
#select .stepBox.step02 .what .txt1 {
  margin-top: 30px;
}
#select .stepBox.step02 .what .priBox {
  margin: 15px 10px 25px;
  display: inline-block;
}
#select .stepBox.step02 .what .priBox .inner {
  padding: 10px 20px;
  font-weight: bold;
  font-size: 1.625rem;
}
#select .stepBox.step02 .what .priBox .inner::after {
  display: inline-block;
  width: 100%;
  height: 120%;
  left: 4px;
}
@media screen and (max-width: 960px) {
  #select h2 {
    padding: 60px 0;
    width: 90%;
    margin-left: auto;
    margin-right: auto;
  }
  #select .intro {
    padding-top: 40px;
    background-size: 100% 100%;
    padding-bottom: 150px;
    margin-bottom: 0;
  }
  #select .intro .catch {
    text-align: center;
    margin-bottom: 30px;
  }
  #select .intro .catch img {
    width: 100%;
  }
  #select .intro p.txt {
    padding: 0 7%;
    text-align: center;
  }
  #select .intro p.txt span {
    width: 200px;
  }
  #select .intro p.txt span img {
    width: inherit;
  }
  #select .intro .priBox {
    width: 90%;
    margin-top: 30px;
  }
  #select .intro .priBox .inner {
    padding: 30px 7%;
    width: 100%;
  }
  #select .intro .priBox .inner::after {
    width: 100%;
    bottom: -7px;
    right: -7px;
  }
  #select .intro::after {
    border-top: 70px solid transparent;
    border-bottom: 50px solid #fff;
  }
  #select .stepArea .priBox .chach {
    bottom: -110px;
    right: 0;
    width: 90%;
    text-align: center;
  }
  #select .stepArea .priBox .chach img {
    margin-left: auto;
    margin-right: auto;
  }
  #select .stepArea .typeList li {
    width: calc((100% - 15px) / 2);
  }
  #select .stepArea .typeList li .inner .titleArea {
    width: 130px;
    height: 130px;
  }
  #select .stepArea .typeList li .inner .titleArea .enSub {
    width: 70%;
    height: 40px;
  }
  #select .stepArea .typeList li .inner .titleArea .txt {
    font-size: 1rem;
    margin-top: 10px;
  }
  #select .stepArea .typeList li.sweet .inner .titleArea .enSub {
    width: 50%;
  }
  #select .stepArea .typeList li.girly .inner .titleArea .enSub {
    width: 50%;
  }
  #select .stepArea .typeList li.cool .inner .titleArea .enSub {
    width: 80%;
  }
  #select .stepArea .typeList li.cool .inner .titleArea .enSub img {
    max-width: 100px;
  }
  #select .stepArea .typeList li.cool .inner .titleArea .txt {
    margin-top: 0;
  }
  #select .stepArea .typeList li.originality .inner .titleArea .enSub {
    width: 80%;
  }
  #select .stepArea .typeList li.originality .inner .titleArea .enSub img {
    width: 100%;
    max-height: inherit;
    max-width: inherit;
  }
  #select .stepArea .typeList li.originality .inner .titleArea .txt {
    margin-top: 0;
  }
  #select .stepBox .priBox {
    margin-bottom: 130px;
  }
  #select .stepBox .priBox .inner {
    padding: 15px 10px;
    width: 100%;
  }
  #select .stepBox .priBox .inner::after {
    width: 100%;
    bottom: -7px;
    right: -7px;
  }
  #select .stepBox .h3Area {
    margin-bottom: 30px;
  }
  #select .stepBox .h3Area .sub {
    margin-bottom: 20px;
  }
  #select .stepBox .h3Area .sub img {
    width: 20%;
  }
  #select .stepBox .h3Area .txt {
    font-size: 1.1rem;
  }
  #select .stepBox .h3Area h3 {
    margin-top: 15px;
  }
  #select .stepBox .h3Area h3 img {
    width: 100%;
    max-width: inherit;
  }
  #select .stepBox.step01 {
    margin-bottom: 30px;
  }
  #select .stepBox.step02 .h3Area h3 img {
    max-width: 100%;
    width: 100%;
  }
  #select .stepBox.step02 .what {
    margin: 30px 0;
  }
  #select .stepBox.step02 .what .priBox {
    margin-bottom: 15px;
  }
  #select .stepBox.step02 .what .priBox .inner {
    font-size: 1.1rem;
    padding: 10px;
  }
  #select .stepBox.step02 .what .priBox .inner::after {
    height: 150%;
    bottom: -12px;
  }
}

/*---------------------------------------------------------------
　support
---------------------------------------------------------------*/
#support > .priBox.yellow .inner {
  padding: 70px 0;
}
#support > .priBox.yellow .inner .reaction1 {
  position: absolute;
  bottom: 0;
  left: -10%;
}
#support > .priBox.yellow .inner .reaction2 {
  position: absolute;
  bottom: 0;
  right: -10%;
}
#support > .priBox.yellow .inner .heading02 {
  margin-bottom: 80px;
  text-align: center;
}
#support > .priBox.yellow .inner .support-menu {
  display: flex;
  flex-wrap: wrap;
}
#support > .priBox.yellow .inner .support-menu li {
  width: calc((100% - 60px) / 3);
  margin-bottom: 30px;
}
#support > .priBox.yellow .inner .support-menu li:first-child {
  width: calc((100% - 60px) / 3 * 2 + 30px);
}
#support > .priBox.yellow .inner .support-menu li + li {
  margin-left: 30px;
}
#support > .priBox.yellow .inner .support-menu li:nth-child(3) {
  margin-left: 0;
}
@media screen and (max-width: 960px) {
  #support > .priBox.yellow .inner {
    padding: 30px 7%;
  }
  #support > .priBox.yellow .inner .reaction1 {
    width: 130px;
  }
  #support > .priBox.yellow .inner .reaction2 {
    width: 97px;
  }
  #support > .priBox.yellow .inner .heading02 {
    margin-bottom: 20px;
  }
  #support > .priBox.yellow .inner .heading02 img {
    width: 100%;
  }
  #support > .priBox.yellow .inner .support-menu li {
    width: calc((100% - 20px) / 2);
    margin-bottom: 20px;
  }
  #support > .priBox.yellow .inner .support-menu li:first-child {
    width: 100%;
  }
  #support > .priBox.yellow .inner .support-menu li + li {
    margin-left: 0;
  }
  #support > .priBox.yellow .inner .support-menu li:nth-child(3), #support > .priBox.yellow .inner .support-menu li:nth-child(5) {
    margin-left: 20px;
  }
}

/*---------------------------------------------------------------
　voice
---------------------------------------------------------------*/
#voice {
  margin-top: 100px;
}
#voice .heading02 {
  text-align: center;
  margin-bottom: 50px;
}
#voice .slider2 div {
  padding: 0 2px;
}
#voice .voice-cont {
  margin-top: 80px;
}
#voice .voice-cont .single {
  display: flex;
  margin-bottom: 60px;
}
#voice .voice-cont .single.is-hidden {
  visibility: hidden;
  opacity: 0;
  height: 0;
  margin: 0;
  padding: 0;
}
#voice .voice-cont .single .photo {
  width: 45%;
  display: flex;
}
#voice .voice-cont .single .photo img:first-child {
  margin-right: 1%;
}
#voice .voice-cont .single .photo img {
  height: -moz-fit-content;
  height: fit-content;
}
#voice .voice-cont .single .text {
  width: 55%;
  padding-left: 40px;
}
#voice .voice-cont .single .text h3 {
  font-size: 1.6rem;
  font-weight: normal;
  margin-bottom: 20px;
  letter-spacing: 0.13em;
}
#voice .voice-cont .single .text .date {
  color: #aaa;
  font-size: 1.1rem;
  margin-bottom: 20px;
}
@media screen and (max-width: 960px) {
  #voice {
    margin-top: 80px;
  }
  #voice .heading02 img {
    width: 90%;
  }
  #voice .voice-cont {
    margin-top: 60px;
  }
  #voice .voice-cont .single {
    display: block;
    margin-bottom: 40px;
  }
  #voice .voice-cont .single .photo {
    display: flex;
    justify-content: space-between;
    width: 100%;
    margin-bottom: 15px;
  }
  #voice .voice-cont .single .photo img {
    width: 49%;
    -o-object-fit: cover;
       object-fit: cover;
    height: auto;
  }
  #voice .voice-cont .single .text {
    width: 100%;
    padding-left: 0;
  }
  #voice .voice-cont .single .text h3 {
    font-size: 1.2rem;
    margin-bottom: 10px;
  }
  #voice .voice-cont .single .text .date {
    font-size: 0.8rem;
    margin-bottom: 10px;
  }
}

.more-btn {
  margin: 0 auto;
  text-align: center;
  height: 80px;
  width: 310px;
}
.more-btn img {
  width: 300px;
  transition: all 0.2s ease-in-out;
}
.more-btn:hover {
  cursor: pointer;
}
.more-btn:hover img {
  width: 310px;
  margin-top: -1px;
}
@media screen and (max-width: 599px) {
  .more-btn {
    width: 200px;
    height: 50px;
  }
}

/*---------------------------------------------------------------
flow
---------------------------------------------------------------*/
#flow {
  margin-top: 80px;
}
#flow .heading02 {
  text-align: center;
  margin-bottom: 40px;
}
#flow .wrap > .priBox > .inner {
  padding-left: 10%;
  padding-right: 10%;
  padding-top: 70px;
  padding-bottom: 60px;
}
#flow ul.flow-list {
  display: flex;
  flex-wrap: wrap;
  justify-content: center;
}
#flow ul.flow-list li {
  z-index: 2;
  position: relative;
  width: calc((100% - 60px) / 4);
  margin-right: 20px;
}
#flow ul.flow-list li .inner {
  background: #FFF;
  border: 1px solid #000;
  border-radius: 10px;
  padding: 30px 0 25px;
  width: 100%;
  height: 100%;
  text-align: center;
}
#flow ul.flow-list li .inner::after {
  width: 100%;
  height: 100%;
  background: #ffff00;
  position: absolute;
  content: "";
  bottom: -6px;
  right: -6px;
  border: 1px solid #000;
  border-radius: 10px;
  z-index: -1;
}
#flow ul.flow-list li.flow01 {
  width: calc(((100% - 60px) / 4 + 10px) * 2);
  position: relative;
}
#flow ul.flow-list li.flow01 .ctaBtn {
  position: relative;
  bottom: inherit;
  right: inherit;
}
#flow ul.flow-list li.flow01 .ctaBtn a {
  width: 170px;
  height: 120px;
  padding: 15px 0;
}
#flow ul.flow-list li.flow01 .ctaBtn a img {
  width: 90px;
}
#flow ul.flow-list li.flow01 .ctaBtn::before {
  width: 170px;
  height: 120px;
  right: inherit;
  bottom: inherit;
  left: 6px;
  top: 6px;
}
#flow ul.flow-list li.flow01 .inner {
  display: flex;
}
#flow ul.flow-list li.flow01 .flexLft {
  width: 50%;
}
#flow ul.flow-list li.flow01 .flexRht {
  width: 50%;
  padding-left: 30px;
}
#flow ul.flow-list li.flow03, #flow ul.flow-list li.flow07 {
  margin-right: 0;
}
#flow ul.flow-list li.flow01, #flow ul.flow-list li.flow02, #flow ul.flow-list li.flow03 {
  margin-bottom: 20px;
}
#flow ul.flow-list li.flow01 p.no, #flow ul.flow-list li.flow06 p.no, #flow ul.flow-list li.flow07 p.no {
  margin-bottom: 30px;
}
#flow ul.flow-list p.no {
  margin-bottom: 15px;
}
#flow ul.flow-list p.flow-cont {
  font-size: 1.6rem;
}
#flow ul.flow-list p.sup {
  font-size: 1rem;
}
#flow .annotation {
  font-size: 1rem;
  margin: 20px 0 0;
}
@media screen and (max-width: 960px) {
  #flow .heading02 {
    margin-bottom: 30px;
  }
  #flow .heading02 img {
    width: 100%;
  }
  #flow .wrap > .priBox > .inner {
    padding-top: 40px;
    padding-bottom: 40px;
  }
  #flow ul.flow-list {
    display: block;
  }
  #flow ul.flow-list li {
    width: 100%;
    margin-bottom: 15px !important;
  }
  #flow ul.flow-list li.flow01 {
    width: 100%;
  }
  #flow ul.flow-list li.flow01 .inner {
    display: block;
  }
  #flow ul.flow-list li.flow01 .flexLft {
    width: 100%;
    margin-bottom: 5px;
  }
  #flow ul.flow-list li.flow01 .flexRht {
    width: 100%;
    padding-left: 0;
    margin-left: 35px;
    margin-bottom: 10px;
  }
  #flow ul.flow-list li .inner {
    text-align: left;
    padding-left: 25px;
    padding-right: 25px;
    padding-top: 20px;
    padding-bottom: 20px;
  }
  #flow ul.flow-list li.flow04 p.sup {
    margin-left: 38px;
    display: block;
  }
  #flow ul.flow-list li.flow05 p.flow-cont {
    margin-left: 38px;
    display: block;
  }
  #flow ul.flow-list li.flow05 p.no {
    margin-left: -5px;
    padding-right: 5px;
  }
  #flow ul.flow-list p.no {
    display: inline;
    padding-right: 12px;
  }
  #flow ul.flow-list p.flow-cont {
    display: inline;
    font-size: 1.2rem;
  }
  #flow ul.flow-list p.flow-cont br {
    display: none;
  }
  #flow ul.flow-list p.sup {
    display: inline;
    font-size: 0.8rem;
  }
  #flow ul.flow-list p.sup br {
    display: none;
  }
  #flow .annotation {
    font-size: 0.8rem;
  }
}

/*---------------------------------------------------------------
　faq
---------------------------------------------------------------*/
#faq {
  margin-top: 100px;
  margin-bottom: 140px;
}
#faq .heading02 {
  text-align: center;
  margin-bottom: 50px;
}
#faq .faq-cont {
  margin-top: 80px;
}
#faq .faq-cont .single {
  margin-bottom: 40px;
}
#faq .faq-cont .single.is-hidden {
  visibility: hidden;
  opacity: 0;
  height: 0;
  margin: 0;
  padding: 0;
}
#faq .faq-cont .single dt {
  margin-bottom: 20px;
  font-size: 1.4rem;
  letter-spacing: 0.15em;
  font-weight: bold;
}
#faq .faq-cont .single dt img {
  margin-right: 20px;
  max-width: 57px;
}
#faq .faq-cont .single dd {
  margin-left: 77px;
}
#faq .faq-more-btn {
  margin: 0 auto;
  text-align: center;
  height: 80px;
  width: 310px;
}
#faq .faq-more-btn img {
  width: 300px;
  transition: all 0.2s ease-in-out;
}
#faq .faq-more-btn:hover {
  cursor: pointer;
}
#faq .faq-more-btn:hover img {
  width: 310px;
  margin-top: -1px;
}
@media screen and (max-width: 599px) {
  #faq .faq-more-btn {
    width: 200px;
    height: 50px;
  }
}
@media screen and (max-width: 960px) {
  #faq {
    margin-top: 60px;
    margin-bottom: 40px;
  }
  #faq .heading02 img {
    width: 80%;
  }
  #faq .faq-cont {
    margin-top: 30px;
  }
  #faq .faq-cont .single {
    margin-bottom: 30px;
  }
  #faq .faq-cont .single dt {
    position: relative;
    padding-left: 55px;
    font-size: 1.2rem;
    letter-spacing: 0.11em;
    margin-bottom: 15px;
  }
  #faq .faq-cont .single dt img {
    position: absolute;
    top: 0;
    left: 0;
    height: 30px;
  }
  #faq .faq-cont .single dd {
    margin-left: 55px;
  }
}

/*---------------------------------------------------------------
　benefit
---------------------------------------------------------------*/
#benefit {
  margin-top: 0;
  background-color: #f3f303;
  background-image: url(../images/furisode/benefit/benefits-bg.jpg);
  background-position: top center;
  background-repeat: no-repeat;
  background-size: contain;
  padding: 0 0 50px;
}
#benefit .wrap {
  padding-top: 100px;
  margin-top: 100px;
}
#benefit .h2-wrap {
  position: relative;
  max-width: 1200px;
}
#benefit .h2-wrap .reaction {
  position: absolute;
  top: -200px;
}
#benefit .h2-wrap .reaction.reaction1 {
  left: -15%;
}
#benefit .h2-wrap .reaction.reaction2 {
  right: -20%;
}
#benefit .heading02 {
  position: relative;
  z-index: 3;
  text-align: center;
  margin-bottom: 120px;
}
#benefit .heading02 img {
  max-width: 80%;
}
#benefit .benefitList li.priBox {
  position: relative;
}
#benefit .benefitList li.priBox .inner {
  padding: 0 0 100px;
}
#benefit .benefitList li.priBox .batch {
  position: absolute;
  width: 20%;
  top: -60px;
  left: -90px;
}
#benefit .benefitList li.priBox .wrap02 .heading03 {
  position: relative;
  top: -50px;
  text-align: center;
}
#benefit .benefitList li.priBox .wrap02 .heading03 img {
  width: 90%;
}
#benefit .benefitList li.priBox .wrap02 > .txt {
  text-align: center;
  margin-bottom: 50px;
  font-size: 1.625rem;
  line-height: 1.6;
}
#benefit .benefitList li.priBox .wrap02 .sup {
  margin-top: 40px;
}
#benefit .benefitList li.priBox .wrap02 .img {
  text-align: center;
}
#benefit .benefitList li.priBox .wrap02 .movie video {
  width: 100%;
}
#benefit .benefitList li.priBox .wrap02 .flex01 {
  align-items: center;
}
#benefit .benefitList li.priBox .wrap02 .flex01 .cntLft {
  width: 60%;
}
#benefit .benefitList li.priBox .wrap02 .flex01 .cntRht {
  width: 40%;
  padding-left: 35px;
}
#benefit .benefitList li.priBox .wrap02 .imgList {
  margin-top: 40px;
  margin-bottom: 60px;
}
#benefit .benefitList li.priBox .wrap02 .imgList li {
  width: calc((100% - 10px) / 3);
}
#benefit .benefitList li.priBox .wrap02 .imgList li .txt {
  font-size: 1.125rem;
  line-height: 1.6;
  padding: 15px 20px 0;
}
#benefit .benefitList li.priBox .wrap02 .imgList li + li {
  margin-left: 5px;
}
#benefit .benefitList li.priBox + li {
  margin-top: 150px;
}
@media screen and (max-width: 960px) {
  #benefit .wrap {
    margin-top: 60px;
    padding-top: 60px;
    overflow: hidden;
  }
  #benefit .h2-wrap {
    max-width: 100%;
  }
  #benefit .h2-wrap .reaction {
    width: 120px;
    top: -50px;
  }
  #benefit .heading02 {
    margin-bottom: 60px;
  }
  #benefit .benefitList li.priBox .inner {
    padding: 0 7% 30px;
  }
  #benefit .benefitList li.priBox .wrap02 .heading03 {
    top: -20px;
  }
  #benefit .benefitList li.priBox .wrap02 > .txt {
    font-size: 1rem;
    margin-bottom: 20px;
  }
  #benefit .benefitList li.priBox .wrap02 .sup {
    margin-bottom: 20px;
  }
  #benefit .benefitList li.priBox .wrap02 .flex01 .cntLft {
    width: 100%;
  }
  #benefit .benefitList li.priBox .wrap02 .flex01 .cntRht {
    width: 100%;
    padding-left: 0;
    padding-top: 20px;
  }
  #benefit .benefitList li.priBox .wrap02 .imgList {
    display: block;
    margin-bottom: 30px;
  }
  #benefit .benefitList li.priBox .wrap02 .imgList li {
    display: flex;
    width: 100%;
    margin-bottom: 25px;
  }
  #benefit .benefitList li.priBox .wrap02 .imgList li .img {
    width: 50%;
  }
  #benefit .benefitList li.priBox .wrap02 .imgList li .txt {
    width: 45%;
    font-size: 1rem;
    padding: 0 0 0 20px;
  }
  #benefit .benefitList li.priBox + li {
    margin-top: 40px;
  }
}/*# sourceMappingURL=furisode.css.map */