@charset "UTF-8";
/*==================================================================
    style.css
===================================================================*/

#ymn {
  /* s0 : 0.5em(1文字16pxの半分の8pxの場合)
  	 s1 : 8
  	 s2 : 16
  	 s3 : 24
     s4 : 32
     s5 : 40
     s6 : 48
     s7 : 56
     s8 : 64
     s10 : 80
     s14 : 104
     s15 : 120
     s19 : 152
  */
  --s0: 0.5em;
  --s1: calc(var(--s0) * 1);
  --s2: calc(var(--s0) * 2);
  --s3: calc(var(--s0) * 3);
  --s4: calc(var(--s0) * 4);
  --s5: calc(var(--s0) * 5);
  --s6: calc(var(--s0) * 6);
  --s7: calc(var(--s0) * 7);
  --s8: calc(var(--s0) * 8);
  --s10: calc(var(--s0) * 10);
  --s13: calc(var(--s0) * 13);
  --s15: calc(var(--s0) * 15);
  --s19: calc(var(--s0) * 19);
  --s9: calc(var(--s0) * 9);
  --s11: calc(var(--s0) * 11);
  --s12: calc(var(--s0) * 12);
  --s14: calc(var(--s0) * 14);
}

#ymn {
  --spa: 15px;
}
@media screen and (max-width: 768px) {
  #ymn {
    --spa: 5.6vw;
  }
}

#ymn {
  --k: #000;
  --k2: #333;
  --k3: #555;
  --w: #fff;
  --g1: #f5f5f5;
  --g2: #ededed;
  --g3: #ccc;
  --g4: #aaa;
  --g5: #777;
  --g6: #666;
  --c1: #1678bf;
  --c2: #66caf2;
  --c3: #d8695d;
  --c4: #50cc85;
  --c5: #b277e0;
  --c6: #e0c332;
  --cCaution: #e20c0c;
}

#ymn {
  --fzS: 1.4rem;
  --fz: 1.6rem;
  --fzM: 1.8rem;
  --fzL: 2rem;
}
@media screen and (max-width: 768px) {
  #ymn {
    --fzS: 1.3rem;
    --fz: 1.5rem;
    --fzM: 1.7rem;
    --fzL: 1.9rem;
  }
}

#ymn {
  --lhS: 1.4;
  --lh: 1.8;
  --lhL: 2.4;
}
@media screen and (max-width: 768px) {
  #ymn {
    --lhS: 1.4;
    --lh: 1.8;
    --lhL: 2.4;
  }
}

#ymn {
  --font1: "Montserrat", sans-serif;
  --font2: "";
}

#ymn {
  --bdrs1: 4px;
  --bdrs2: 6px;
  --opacity: 0.5;
  --bxs1: 0px 0px 10px 0px rgba(0, 0, 0, 0.2);
  --bxs2: 0px -6px 0px -2px rgba(0, 0, 0, 0.2) inset;
  --txs1: 0px 0px 12px rgba(0, 0, 0, 0.6);
  --grd1: linear-gradient(135deg, #ffa84c 0%, #ff7b0d 100%);
}

#ymn {
  --ease: cubic-bezier(0.25, 0.1, 0.25, 1);
  --linear: cubic-bezier(0, 0, 1, 1);
  --In: cubic-bezier(0.42, 0, 1, 1);
  --Out: cubic-bezier(0, 0, 0.58, 1);
  --InOut: cubic-bezier(0.42, 0, 0.58, 1);
  --easeInQuad: cubic-bezier(0.55, 0.085, 0.68, 0.53);
  --easeOutQuad: cubic-bezier(0.25, 0.46, 0.45, 0.94);
  --easeInOutQuad: cubic-bezier(0.455, 0.03, 0.515, 0.955);
  --easeInSine: cubic-bezier(0.47, 0, 0.745, 0.715);
  --easeOutSine: cubic-bezier(0.39, 0.575, 0.565, 1);
  --easeInOutSine: cubic-bezier(0.445, 0.05, 0.55, 0.95);
  --easeInCubic: cubic-bezier(0.55, 0.055, 0.675, 0.19);
  --easeOutCubic: cubic-bezier(0.215, 0.61, 0.355, 1);
  --easeInOutCubic: cubic-bezier(0.645, 0.045, 0.355, 1);
  --easeInQuart: cubic-bezier(0.895, 0.03, 0.685, 0.22);
  --easeOutQuart: cubic-bezier(0.165, 0.84, 0.44, 1);
  --easeInOutQuart: cubic-bezier(0.77, 0, 0.175, 1);
  --easeInQuint: cubic-bezier(0.755, 0.05, 0.855, 0.06);
  --easeOutQuint: cubic-bezier(0.23, 1, 0.32, 1);
  --easeInOutQuint: cubic-bezier(0.86, 0, 0.07, 1);
  --easeInExpo: cubic-bezier(0.95, 0.05, 0.795, 0.035);
  --easeOutExpo: cubic-bezier(0.19, 1, 0.22, 1);
  --easeInOutExpo: cubic-bezier(1, 0, 0, 1);
  --easeInCirc: cubic-bezier(0.6, 0.04, 0.98, 0.335);
  --easeOutCirc: cubic-bezier(0.075, 0.82, 0.165, 1);
  --easeInOutCirc: cubic-bezier(0.785, 0.135, 0.15, 0.86);
  --easeInBack: cubic-bezier(0.6, -0.28, 0.735, 0.045);
  --easeOutBack: cubic-bezier(0.175, 0.885, 0.32, 1.275);
  --easeInOutBack: cubic-bezier(0.68, -0.55, 0.265, 1.55);
  --time: 200ms;
  --transition: all var(--time) var(--Out);
  --ease1: all var(--time) var(--ease);
  --ease2: all var(--time) cubic-bezier(0.55, 0.055, 0.675, 0.19);
  --ease3: all var(--time) var(--easeInOutCubic);
}

/*==================================================================
    style.css
===================================================================*/
/*==================================================================
    reset
===================================================================*/
#ymn {
  overflow-x: hidden;
  background: #fff;
}

#ymn-wrapper {
  overflow-x: hidden;
  min-width: 320px;
  -webkit-text-size-adjust: none;
  -ms-text-size-adjust: none;
  word-wrap: break-word;
}

#ymn {
  /*  touch
  ---------------------------------------------*/
  /*  box-sizing
  ---------------------------------------------*/
  /*  table
  ---------------------------------------------*/
  /*  main
  ---------------------------------------------*/
  /* IE10,11対策 main要素の高さと幅を認識させる */
  /*  list
  ---------------------------------------------*/
  /*  form
  ---------------------------------------------*/
  /* ======= outline ======= */
  /* ======= label ======= */
}
#ymn div,
#ymn dl,
#ymn dt,
#ymn dd,
#ymn ul,
#ymn ol,
#ymn li,
#ymn h1,
#ymn h2,
#ymn h3,
#ymn h4,
#ymn h5,
#ymn h6,
#ymn object,
#ymn iframe,
#ymn pre,
#ymn code,
#ymn p,
#ymn blockquote,
#ymn form,
#ymn fieldset,
#ymn legend,
#ymn table,
#ymn th,
#ymn td,
#ymn caption,
#ymn tbody,
#ymn tfoot,
#ymn thead,
#ymn article,
#ymn aside,
#ymn figure,
#ymn footer,
#ymn header,
#ymn hgroup,
#ymn menu,
#ymn nav,
#ymn section,
#ymn audio,
#ymn video,
#ymn canvas {
  margin: 0;
  padding: 0;
}
#ymn article,
#ymn aside,
#ymn details,
#ymn figcaption,
#ymn figure,
#ymn footer,
#ymn header,
#ymn hgroup,
#ymn nav,
#ymn section,
#ymn menu {
  display: block;
}
#ymn audio:not([controls]) {
  display: none;
  height: 0;
}
#ymn [hidden] {
  display: none;
}
#ymn table {
  border-collapse: collapse;
  border-spacing: 0;
}
#ymn fieldset,
#ymn img {
  border: none;
}
#ymn address,
#ymn caption,
#ymn cite,
#ymn code,
#ymn dfn,
#ymn em,
#ymn strong,
#ymn th,
#ymn var {
  font-style: normal;
  font-weight: normal;
}
#ymn ul,
#ymn ol,
#ymn menu {
  list-style: none;
}
#ymn caption,
#ymn th {
  text-align: left;
}
#ymn h1,
#ymn h2,
#ymn h3,
#ymn h4,
#ymn h5,
#ymn h6 {
  font-size: 100%;
  font-weight: normal;
}
#ymn q:before,
#ymn q:after {
  content: "";
}
#ymn abbr,
#ymn acronym {
  border: none;
  font-variant: normal;
}
#ymn sup {
  vertical-align: text-top;
}
#ymn sub {
  vertical-align: text-bottom;
}
#ymn input,
#ymn textarea,
#ymn select {
  font-family: inherit;
  font-size: inherit;
  font-weight: inherit;
}
#ymn legend {
  color: #000;
}
#ymn a img,
#ymn map a {
  border: none;
}
#ymn a:hover,
#ymn a:active,
#ymn a:focus {
  outline: 0;
}
#ymn embed {
  width: 100%;
}
#ymn audio,
#ymn canvas,
#ymn video {
  display: inline-block;
}
#ymn audio:not([controls]) {
  display: none;
  height: 0;
}
#ymn img,
#ymn object,
#ymn embed {
  max-width: 100%;
  height: auto;
}
#ymn object,
#ymn embed {
  height: 100%;
}
#ymn img {
  vertical-align: bottom;
  -ms-interpolation-mode: bicubic;
}
#ymn div {
  vertical-align: top;
}
#ymn strong {
  font-weight: bold;
}
#ymn em {
  font-style: normal;
}
#ymn select,
#ymn input,
#ymn button,
#ymn textarea,
#ymn button {
  font: 99% arial, sans-serif;
}
#ymn pre,
#ymn code,
#ymn kbd,
#ymn samp,
#ymn tt {
  font-family: monospace;
  line-height: 1;
}
#ymn a,
#ymn img,
#ymn button,
#ymn input[type=button],
#ymn input[type=submit],
#ymn .touch-hover {
  -webkit-tap-highlight-color: transparent;
}
#ymn * {
  box-sizing: border-box;
}
#ymn *::before, #ymn *::after {
  box-sizing: border-box;
}
#ymn table {
  empty-cells: show;
  font-size: inherit;
  font: 100%;
}
@media all and (-ms-high-contrast: none) {
  #ymn main {
    display: block;
  }
}
#ymn li {
  list-style: none;
  line-height: 1;
}
#ymn input {
  line-height: 1;
}
#ymn form img,
#ymn input,
#ymn select {
  vertical-align: middle;
}
#ymn textarea {
  resize: none;
}
#ymn select {
  padding: 1px;
}
#ymn legend {
  display: none;
}
#ymn input,
#ymn select,
#ymn textarea,
#ymn button {
  font-size: var(--fz);
  vertical-align: middle;
  color: var(--k);
  height: auto;
}
@media screen and (max-width: 768px) {
  #ymn input,
  #ymn select,
  #ymn textarea,
  #ymn button {
    font-size: 1.6rem;
  }
}
#ymn textarea {
  height: auto;
}
#ymn input[type=text],
#ymn input[type=tel],
#ymn input[type=email],
#ymn input[type=password],
#ymn select,
#ymn textarea {
  appearance: none;
  -webkit-appearance: none;
  font-size: var(--fz);
  width: 100%;
  padding: 1rem 1.2rem;
  border: 1px solid #ccc;
  background: #fff;
  font-weight: normal;
  border-radius: var(--bdrs1);
}
@media screen and (max-width: 768px) {
  #ymn input[type=text],
  #ymn input[type=tel],
  #ymn input[type=email],
  #ymn input[type=password],
  #ymn select,
  #ymn textarea {
    font-size: 1.6rem;
  }
}
#ymn input[type=email],
#ymn input[type=text],
#ymn input[type=number],
#ymn input[type=password],
#ymn textarea,
#ymn select {
  outline: none;
}
#ymn label {
  margin-right: 1em;
  line-height: 1;
}

/*==================================================================
    style.css
===================================================================*/
/*==================================================================
    utility
===================================================================*/
#ymn {
  /* ------------------------------------------------------------------
    Visual utility
  -------------------------------------------------------------------*/
  /*  display
  ---------------------------------------------*/
  /* ======= display none ======= */
  /*  position
  ---------------------------------------------*/
  /*  float
  ---------------------------------------------*/
  /*  hover
  ---------------------------------------------*/
  /*  .scrollWSp SP時に横幅からはみ出す要素(tableなど)に囲って使用
  ---------------------------------------------*/
  /* .firstload ※初回読み込み時のCSSトランジション防止
  ------------------------------------------------*/
  /* ------------------------------------------------------------------
    width utility
  -------------------------------------------------------------------*/
  /* ------------------------------------------------------------------
    BoxModel utility
  -------------------------------------------------------------------*/
  /* ------------------------------------------------------------------
    Text utiity
  -------------------------------------------------------------------*/
  /*  font-family
  ---------------------------------------------*/
  /*  color
  ---------------------------------------------*/
  /*  align
  ---------------------------------------------*/
  /* font-size
  ---------------------------------------------*/
}
#ymn .noDisplay {
  display: none !important;
}
#ymn .block {
  display: block !important;
}
#ymn .inline {
  display: inline !important;
}
#ymn .inlineBlock {
  display: inline-block !important;
}
@media screen and (min-width: 769px) {
  #ymn .pcNone {
    display: none !important;
  }
}
@media screen and (max-width: 768px) {
  #ymn .spNone {
    display: none !important;
  }
}
#ymn .static {
  position: static !important;
}
#ymn .relative {
  position: relative !important;
}
#ymn .absolute {
  position: absolute !important;
}
#ymn .fixed {
  position: fixed !important;
}
#ymn .leftBox {
  float: left;
}
#ymn .rightBox {
  float: right;
}
#ymn .nofloat {
  float: none !important;
}
#ymn .clearfix {
  zoom: 1;
}
#ymn .clearfix:after {
  display: block;
  clear: both;
  content: "";
}
#ymn .clear {
  clear: both !important;
}
#ymn .hover:hover {
  filter: alpha(opacity=70);
  -moz-opacity: 0.7;
  -khtml-opacity: 0.7;
  opacity: 0.7;
}
@media screen and (max-width: 768px) {
  #ymn .scrollWSp {
    overflow: auto;
    white-space: nowrap;
    -webkit-overflow-scrolling: touch;
  }
}
#ymn .firstload {
  transition: 0s !important;
}
#ymn .w10 {
  width: 10% !important;
}
#ymn .w20 {
  width: 20% !important;
}
#ymn .w30 {
  width: 30% !important;
}
#ymn .w40 {
  width: 40% !important;
}
#ymn .w50 {
  width: 50% !important;
}
#ymn .w60 {
  width: 60% !important;
}
#ymn .w70 {
  width: 70% !important;
}
#ymn .w80 {
  width: 80% !important;
}
#ymn .w90 {
  width: 90% !important;
}
#ymn .w100 {
  width: 100% !important;
}
#ymn .mt0 {
  margin-top: 0px !important;
}
#ymn .mb0 {
  margin-bottom: 0px !important;
}
#ymn .mr0 {
  margin-right: 0px !important;
}
#ymn .ml0 {
  margin-left: 0px !important;
}
#ymn .pt0 {
  padding-top: 0px !important;
}
#ymn .pb0 {
  padding-bottom: 0px !important;
}
#ymn .pr0 {
  padding-right: 0px !important;
}
#ymn .pl0 {
  padding-left: 0px !important;
}
#ymn .mt5 {
  margin-top: 5px !important;
}
#ymn .mb5 {
  margin-bottom: 5px !important;
}
#ymn .mr5 {
  margin-right: 5px !important;
}
#ymn .ml5 {
  margin-left: 5px !important;
}
#ymn .pt5 {
  padding-top: 5px !important;
}
#ymn .pb5 {
  padding-bottom: 5px !important;
}
#ymn .pr5 {
  padding-right: 5px !important;
}
#ymn .pl5 {
  padding-left: 5px !important;
}
#ymn .mt10 {
  margin-top: 10px !important;
}
#ymn .mb10 {
  margin-bottom: 10px !important;
}
#ymn .mr10 {
  margin-right: 10px !important;
}
#ymn .ml10 {
  margin-left: 10px !important;
}
#ymn .pt10 {
  padding-top: 10px !important;
}
#ymn .pb10 {
  padding-bottom: 10px !important;
}
#ymn .pr10 {
  padding-right: 10px !important;
}
#ymn .pl10 {
  padding-left: 10px !important;
}
#ymn .mt15 {
  margin-top: 15px !important;
}
#ymn .mb15 {
  margin-bottom: 15px !important;
}
#ymn .mr15 {
  margin-right: 15px !important;
}
#ymn .ml15 {
  margin-left: 15px !important;
}
#ymn .pt15 {
  padding-top: 15px !important;
}
#ymn .pb15 {
  padding-bottom: 15px !important;
}
#ymn .pr15 {
  padding-right: 15px !important;
}
#ymn .pl15 {
  padding-left: 15px !important;
}
#ymn .mt20 {
  margin-top: 20px !important;
}
#ymn .mb20 {
  margin-bottom: 20px !important;
}
#ymn .mr20 {
  margin-right: 20px !important;
}
#ymn .ml20 {
  margin-left: 20px !important;
}
#ymn .pt20 {
  padding-top: 20px !important;
}
#ymn .pb20 {
  padding-bottom: 20px !important;
}
#ymn .pr20 {
  padding-right: 20px !important;
}
#ymn .pl20 {
  padding-left: 20px !important;
}
#ymn .mt25 {
  margin-top: 25px !important;
}
#ymn .mb25 {
  margin-bottom: 25px !important;
}
#ymn .mr25 {
  margin-right: 25px !important;
}
#ymn .ml25 {
  margin-left: 25px !important;
}
#ymn .pt25 {
  padding-top: 25px !important;
}
#ymn .pb25 {
  padding-bottom: 25px !important;
}
#ymn .pr25 {
  padding-right: 25px !important;
}
#ymn .pl25 {
  padding-left: 25px !important;
}
#ymn .mt30 {
  margin-top: 30px !important;
}
#ymn .mb30 {
  margin-bottom: 30px !important;
}
#ymn .mr30 {
  margin-right: 30px !important;
}
#ymn .ml30 {
  margin-left: 30px !important;
}
#ymn .pt30 {
  padding-top: 30px !important;
}
#ymn .pb30 {
  padding-bottom: 30px !important;
}
#ymn .pr30 {
  padding-right: 30px !important;
}
#ymn .pl30 {
  padding-left: 30px !important;
}
#ymn .mt35 {
  margin-top: 35px !important;
}
#ymn .mb35 {
  margin-bottom: 35px !important;
}
#ymn .mr35 {
  margin-right: 35px !important;
}
#ymn .ml35 {
  margin-left: 35px !important;
}
#ymn .pt35 {
  padding-top: 35px !important;
}
#ymn .pb35 {
  padding-bottom: 35px !important;
}
#ymn .pr35 {
  padding-right: 35px !important;
}
#ymn .pl35 {
  padding-left: 35px !important;
}
#ymn .mt40 {
  margin-top: 40px !important;
}
#ymn .mb40 {
  margin-bottom: 40px !important;
}
#ymn .mr40 {
  margin-right: 40px !important;
}
#ymn .ml40 {
  margin-left: 40px !important;
}
#ymn .pt40 {
  padding-top: 40px !important;
}
#ymn .pb40 {
  padding-bottom: 40px !important;
}
#ymn .pr40 {
  padding-right: 40px !important;
}
#ymn .pl40 {
  padding-left: 40px !important;
}
#ymn .mt45 {
  margin-top: 45px !important;
}
#ymn .mb45 {
  margin-bottom: 45px !important;
}
#ymn .mr45 {
  margin-right: 45px !important;
}
#ymn .ml45 {
  margin-left: 45px !important;
}
#ymn .pt45 {
  padding-top: 45px !important;
}
#ymn .pb45 {
  padding-bottom: 45px !important;
}
#ymn .pr45 {
  padding-right: 45px !important;
}
#ymn .pl45 {
  padding-left: 45px !important;
}
#ymn .mt50 {
  margin-top: 50px !important;
}
#ymn .mb50 {
  margin-bottom: 50px !important;
}
#ymn .mr50 {
  margin-right: 50px !important;
}
#ymn .ml50 {
  margin-left: 50px !important;
}
#ymn .pt50 {
  padding-top: 50px !important;
}
#ymn .pb50 {
  padding-bottom: 50px !important;
}
#ymn .pr50 {
  padding-right: 50px !important;
}
#ymn .pl50 {
  padding-left: 50px !important;
}
#ymn .mt55 {
  margin-top: 55px !important;
}
#ymn .mb55 {
  margin-bottom: 55px !important;
}
#ymn .mr55 {
  margin-right: 55px !important;
}
#ymn .ml55 {
  margin-left: 55px !important;
}
#ymn .pt55 {
  padding-top: 55px !important;
}
#ymn .pb55 {
  padding-bottom: 55px !important;
}
#ymn .pr55 {
  padding-right: 55px !important;
}
#ymn .pl55 {
  padding-left: 55px !important;
}
#ymn .mt60 {
  margin-top: 60px !important;
}
#ymn .mb60 {
  margin-bottom: 60px !important;
}
#ymn .mr60 {
  margin-right: 60px !important;
}
#ymn .ml60 {
  margin-left: 60px !important;
}
#ymn .pt60 {
  padding-top: 60px !important;
}
#ymn .pb60 {
  padding-bottom: 60px !important;
}
#ymn .pr60 {
  padding-right: 60px !important;
}
#ymn .pl60 {
  padding-left: 60px !important;
}
#ymn .mt65 {
  margin-top: 65px !important;
}
#ymn .mb65 {
  margin-bottom: 65px !important;
}
#ymn .mr65 {
  margin-right: 65px !important;
}
#ymn .ml65 {
  margin-left: 65px !important;
}
#ymn .pt65 {
  padding-top: 65px !important;
}
#ymn .pb65 {
  padding-bottom: 65px !important;
}
#ymn .pr65 {
  padding-right: 65px !important;
}
#ymn .pl65 {
  padding-left: 65px !important;
}
#ymn .mt70 {
  margin-top: 70px !important;
}
#ymn .mb70 {
  margin-bottom: 70px !important;
}
#ymn .mr70 {
  margin-right: 70px !important;
}
#ymn .ml70 {
  margin-left: 70px !important;
}
#ymn .pt70 {
  padding-top: 70px !important;
}
#ymn .pb70 {
  padding-bottom: 70px !important;
}
#ymn .pr70 {
  padding-right: 70px !important;
}
#ymn .pl70 {
  padding-left: 70px !important;
}
#ymn .mt75 {
  margin-top: 75px !important;
}
#ymn .mb75 {
  margin-bottom: 75px !important;
}
#ymn .mr75 {
  margin-right: 75px !important;
}
#ymn .ml75 {
  margin-left: 75px !important;
}
#ymn .pt75 {
  padding-top: 75px !important;
}
#ymn .pb75 {
  padding-bottom: 75px !important;
}
#ymn .pr75 {
  padding-right: 75px !important;
}
#ymn .pl75 {
  padding-left: 75px !important;
}
#ymn .bold {
  font-weight: bold !important;
}
#ymn .italic {
  font-style: italic !important;
}
#ymn .note {
  color: var(--g1);
  margin-left: 1em;
  text-indent: -1em;
}
#ymn .underline {
  text-decoration: underline !important;
}
#ymn .textNoLine {
  text-decoration: none !important;
}
#ymn .font1 {
  font-family: var(--font1) !important;
}
#ymn .font2 {
  font-family: var(--font2) !important;
}
#ymn .white {
  color: var(--w);
}
#ymn .black {
  color: var(--k);
}
#ymn .c-caution {
  color: var(--cCaution);
}
#ymn .middle {
  vertical-align: middle !important;
}
#ymn .center {
  text-align: center !important;
}
#ymn .left {
  text-align: left !important;
}
#ymn .right {
  text-align: right !important;
}
#ymn .fz {
  font-size: var(--fz);
}
#ymn .fz-s {
  font-size: var(--fzS);
  line-height: var(--lhS);
}
#ymn .fz-l {
  font-size: var(--fzL);
  line-height: var(--lhL);
}
#ymn .fz8 {
  font-size: 0.8rem !important;
}
#ymn .fz9 {
  font-size: 0.9rem !important;
}
#ymn .fz10 {
  font-size: 1rem !important;
}
#ymn .fz11 {
  font-size: 1.1rem !important;
}
#ymn .fz12 {
  font-size: 1.2rem !important;
}
#ymn .fz13 {
  font-size: 1.3rem !important;
}
#ymn .fz14 {
  font-size: 1.4rem !important;
}
#ymn .fz15 {
  font-size: 1.5rem !important;
}
#ymn .fz16 {
  font-size: 1.6rem !important;
}
#ymn .fz17 {
  font-size: 1.7rem !important;
}
#ymn .fz18 {
  font-size: 1.8rem !important;
}
#ymn .fz19 {
  font-size: 1.9rem !important;
}
#ymn .fz20 {
  font-size: 2rem !important;
}
#ymn .fz21 {
  font-size: 2.1rem !important;
}
#ymn .fz22 {
  font-size: 2.2rem !important;
}
#ymn .fz23 {
  font-size: 2.3rem !important;
}
#ymn .fz24 {
  font-size: 2.4rem !important;
}
#ymn .fz25 {
  font-size: 2.5rem !important;
}
#ymn .fz26 {
  font-size: 2.6rem !important;
}
#ymn .fz27 {
  font-size: 2.7rem !important;
}
#ymn .fz28 {
  font-size: 2.8rem !important;
}
#ymn .fz29 {
  font-size: 2.9rem !important;
}
#ymn .fz30 {
  font-size: 3rem !important;
}

/*==================================================================
    style.css
===================================================================*/
/*==================================================================
    general
===================================================================*/
/* -----------------------------------------------
    font
------------------------------------------------*/
#ymn-wrapper {
  --root-font-size: 14;
  font-family: "Helvetica Neue", Arial, "Hiragino sans", "Hiragino Kaku Gothic ProN", "Meiryo", sans-serif;
  font-size: 1rem;
  color: var(--k);
  font-weight: 400;
  line-height: 1;
  font-kerning: normal;
  text-rendering: optimizeLegibility;
  -webkit-font-smoothing: antialiased;
}

@media screen and (max-width: 374px) {
  #ymn,
  #ymn-wrapper {
    font-size: 9px;
    line-height: 1;
  }
}
#ymn {
  /* -----------------------------------------------
      p
  ------------------------------------------------*/
  /* ======= hiwrite ======= */
  /* ======= テキストの下線スタイル ======= */
  /* ======= 上付き文字、下付き文字 ======= */
  /* ======= 注釈 ======= */
  /* -----------------------------------------------
      link
  ------------------------------------------------*/
  /*  a img
  ---------------------------------------------*/
  /* ======= hover ======= */
  /*  .link - decoration underline
  ---------------------------------------------*/
}
#ymn ::selection {
  background: #a6d2fc;
}
#ymn .underHiwrite {
  background: linear-gradient(transparent 80%, #ff0 80%);
}
#ymn sup {
  font-size: 70%;
  vertical-align: top;
  position: relative;
  top: -0.1em;
}
#ymn .subText {
  font-size: 75.5%;
  vertical-align: bottom;
  position: relative;
  top: 0.1em;
}
#ymn .annotation {
  color: #666;
  font-size: var(--fzS);
}
#ymn a {
  text-decoration: none;
  transition: var(--transition);
}
#ymn .pc a:hover {
  text-decoration: none;
}
#ymn a img {
  transition: var(--transition);
}
#ymn a[href^="tel:"] {
  cursor: default;
}
#ymn a[href^="tel:"]:hover img {
  opacity: 1;
}
#ymn a.link {
  color: var(--c1);
  text-decoration: underline;
}
#ymn .pc a.link:hover {
  text-decoration: none;
  color: var(--c1);
}

/*==================================================================
    style.css
===================================================================*/
/*==================================================================
    layout
===================================================================*/
#ymn {
  /*  container
  ---------------------------------------------*/
}
#ymn .ymn-container {
  width: 100%;
  max-width: 1030px;
  padding-right: var(--spa);
  padding-left: var(--spa);
  margin-right: auto;
  margin-left: auto;
}
@media screen and (max-width: 768px) {
  #ymn .ymn-container {
    max-width: auto;
  }
}
#ymn .ymn-container.-large {
  max-width: 1230px;
}
@media screen and (max-width: 768px) {
  #ymn .ymn-container.-large {
    max-width: auto;
  }
}
@media screen and (min-width: 1501px) {
  #ymn .ymn-container.-large {
    max-width: 1430px;
  }
}
#ymn .ymn-container.-small {
  max-width: 860px;
}
@media screen and (max-width: 768px) {
  #ymn .ymn-container.-small {
    max-width: auto;
  }
}
#ymn .ymn-container.-min {
  max-width: 690px;
}
@media screen and (max-width: 768px) {
  #ymn .ymn-container.-min {
    max-width: auto;
  }
}
#ymn .ymn-container.-fluid {
  max-width: none;
  padding-right: 0;
  padding-left: 0;
}
#ymn .ymn-container--fluid {
  width: 100%;
  padding-right: 0;
  padding-left: 0;
  margin-right: auto;
  margin-left: auto;
}

/*==================================================================
    style.css
===================================================================*/
/*==================================================================
    animation
===================================================================*/
#ymn {
  /*  setting
  ---------------------------------------------*/
  /*  duration
  ---------------------------------------------*/
  /*  delay
  ---------------------------------------------*/
}
#ymn .animate {
  visibility: hidden;
  transition: var(--transition);
  animation-duration: var(--time);
  animation-fill-mode: both;
}
#ymn .animate.-animated {
  visibility: visible;
}
#ymn .aInfinite {
  animation-iteration-count: infinite;
}
#ymn .aEx {
  transform: translate3d(0, 0, 0);
}
#ymn .-a0 {
  animation-duration: 0s;
  animation-fill-mode: both;
}
#ymn .-a1 {
  animation-duration: 0.1s;
  animation-fill-mode: both;
}
#ymn .-a2 {
  animation-duration: 0.2s;
  animation-fill-mode: both;
}
#ymn .-a3 {
  animation-duration: 0.3s;
  animation-fill-mode: both;
}
#ymn .-a4 {
  animation-duration: 0.4s;
  animation-fill-mode: both;
}
#ymn .-a5 {
  animation-duration: 0.5s;
  animation-fill-mode: both;
}
#ymn .-a6 {
  animation-duration: 0.6s;
  animation-fill-mode: both;
}
#ymn .-a7 {
  animation-duration: 0.7s;
  animation-fill-mode: both;
}
#ymn .-a8 {
  animation-duration: 0.8s;
  animation-fill-mode: both;
}
#ymn .-a9 {
  animation-duration: 0.9s;
  animation-fill-mode: both;
}
#ymn .-a10 {
  animation-duration: 1s;
  animation-fill-mode: both;
}
#ymn .-a11 {
  animation-duration: 1.1s;
  animation-fill-mode: both;
}
#ymn .-a12 {
  animation-duration: 1.2s;
  animation-fill-mode: both;
}
#ymn .-a13 {
  animation-duration: 1.3s;
  animation-fill-mode: both;
}
#ymn .-a14 {
  animation-duration: 1.4s;
  animation-fill-mode: both;
}
#ymn .-a15 {
  animation-duration: 1.5s;
  animation-fill-mode: both;
}
#ymn .-a16 {
  animation-duration: 1.6s;
  animation-fill-mode: both;
}
#ymn .-a17 {
  animation-duration: 1.7s;
  animation-fill-mode: both;
}
#ymn .-a18 {
  animation-duration: 1.8s;
  animation-fill-mode: both;
}
#ymn .-a19 {
  animation-duration: 1.9s;
  animation-fill-mode: both;
}
#ymn .-a20 {
  animation-duration: 2s;
  animation-fill-mode: both;
}
#ymn .-a21 {
  animation-duration: 2.1s;
  animation-fill-mode: both;
}
#ymn .-a22 {
  animation-duration: 2.2s;
  animation-fill-mode: both;
}
#ymn .-a23 {
  animation-duration: 2.3s;
  animation-fill-mode: both;
}
#ymn .-a24 {
  animation-duration: 2.4s;
  animation-fill-mode: both;
}
#ymn .-a25 {
  animation-duration: 2.5s;
  animation-fill-mode: both;
}
#ymn .-a26 {
  animation-duration: 2.6s;
  animation-fill-mode: both;
}
#ymn .-a27 {
  animation-duration: 2.7s;
  animation-fill-mode: both;
}
#ymn .-a28 {
  animation-duration: 2.8s;
  animation-fill-mode: both;
}
#ymn .-a29 {
  animation-duration: 2.9s;
  animation-fill-mode: both;
}
#ymn .-a30 {
  animation-duration: 3s;
  animation-fill-mode: both;
}
#ymn .-a31 {
  animation-duration: 3.1s;
  animation-fill-mode: both;
}
#ymn .-a32 {
  animation-duration: 3.2s;
  animation-fill-mode: both;
}
#ymn .-a33 {
  animation-duration: 3.3s;
  animation-fill-mode: both;
}
#ymn .-a34 {
  animation-duration: 3.4s;
  animation-fill-mode: both;
}
#ymn .-a35 {
  animation-duration: 3.5s;
  animation-fill-mode: both;
}
#ymn .-a36 {
  animation-duration: 3.6s;
  animation-fill-mode: both;
}
#ymn .-a37 {
  animation-duration: 3.7s;
  animation-fill-mode: both;
}
#ymn .-a38 {
  animation-duration: 3.8s;
  animation-fill-mode: both;
}
#ymn .-a39 {
  animation-duration: 3.9s;
  animation-fill-mode: both;
}
#ymn .-a40 {
  animation-duration: 4s;
  animation-fill-mode: both;
}
#ymn .-a41 {
  animation-duration: 4.1s;
  animation-fill-mode: both;
}
#ymn .-a42 {
  animation-duration: 4.2s;
  animation-fill-mode: both;
}
#ymn .-a43 {
  animation-duration: 4.3s;
  animation-fill-mode: both;
}
#ymn .-a44 {
  animation-duration: 4.4s;
  animation-fill-mode: both;
}
#ymn .-a45 {
  animation-duration: 4.5s;
  animation-fill-mode: both;
}
#ymn .-a46 {
  animation-duration: 4.6s;
  animation-fill-mode: both;
}
#ymn .-a47 {
  animation-duration: 4.7s;
  animation-fill-mode: both;
}
#ymn .-a48 {
  animation-duration: 4.8s;
  animation-fill-mode: both;
}
#ymn .-a49 {
  animation-duration: 4.9s;
  animation-fill-mode: both;
}
#ymn .-a50 {
  animation-duration: 5s;
  animation-fill-mode: both;
}
#ymn .-ad0 {
  animation-delay: 0s;
}
#ymn .-ad1 {
  animation-delay: 0.1s;
}
#ymn .-ad2 {
  animation-delay: 0.2s;
}
#ymn .-ad3 {
  animation-delay: 0.3s;
}
#ymn .-ad4 {
  animation-delay: 0.4s;
}
#ymn .-ad5 {
  animation-delay: 0.5s;
}
#ymn .-ad6 {
  animation-delay: 0.6s;
}
#ymn .-ad7 {
  animation-delay: 0.7s;
}
#ymn .-ad8 {
  animation-delay: 0.8s;
}
#ymn .-ad9 {
  animation-delay: 0.9s;
}
#ymn .-ad10 {
  animation-delay: 1s;
}
#ymn .-ad11 {
  animation-delay: 1.1s;
}
#ymn .-ad12 {
  animation-delay: 1.2s;
}
#ymn .-ad13 {
  animation-delay: 1.3s;
}
#ymn .-ad14 {
  animation-delay: 1.4s;
}
#ymn .-ad15 {
  animation-delay: 1.5s;
}
#ymn .-ad16 {
  animation-delay: 1.6s;
}
#ymn .-ad17 {
  animation-delay: 1.7s;
}
#ymn .-ad18 {
  animation-delay: 1.8s;
}
#ymn .-ad19 {
  animation-delay: 1.9s;
}
#ymn .-ad20 {
  animation-delay: 2s;
}
#ymn .-ad21 {
  animation-delay: 2.1s;
}
#ymn .-ad22 {
  animation-delay: 2.2s;
}
#ymn .-ad23 {
  animation-delay: 2.3s;
}
#ymn .-ad24 {
  animation-delay: 2.4s;
}
#ymn .-ad25 {
  animation-delay: 2.5s;
}
#ymn .-ad26 {
  animation-delay: 2.6s;
}
#ymn .-ad27 {
  animation-delay: 2.7s;
}
#ymn .-ad28 {
  animation-delay: 2.8s;
}
#ymn .-ad29 {
  animation-delay: 2.9s;
}
#ymn .-ad30 {
  animation-delay: 3s;
}
#ymn .-ad31 {
  animation-delay: 3.1s;
}
#ymn .-ad32 {
  animation-delay: 3.2s;
}
#ymn .-ad33 {
  animation-delay: 3.3s;
}
#ymn .-ad34 {
  animation-delay: 3.4s;
}
#ymn .-ad35 {
  animation-delay: 3.5s;
}
#ymn .-ad36 {
  animation-delay: 3.6s;
}
#ymn .-ad37 {
  animation-delay: 3.7s;
}
#ymn .-ad38 {
  animation-delay: 3.8s;
}
#ymn .-ad39 {
  animation-delay: 3.9s;
}
#ymn .-ad40 {
  animation-delay: 4s;
}
#ymn .-ad41 {
  animation-delay: 4.1s;
}
#ymn .-ad42 {
  animation-delay: 4.2s;
}
#ymn .-ad43 {
  animation-delay: 4.3s;
}
#ymn .-ad44 {
  animation-delay: 4.4s;
}
#ymn .-ad45 {
  animation-delay: 4.5s;
}
#ymn .-ad46 {
  animation-delay: 4.6s;
}
#ymn .-ad47 {
  animation-delay: 4.7s;
}
#ymn .-ad48 {
  animation-delay: 4.8s;
}
#ymn .-ad49 {
  animation-delay: 4.9s;
}
#ymn .-ad50 {
  animation-delay: 5s;
}

@keyframes fadeIn {
  0% {
    opacity: 0;
  }
  100% {
    opacity: 1;
  }
}
.fadeIn {
  animation-name: fadeIn;
}

@keyframes fadeInUp {
  0% {
    opacity: 0;
    transform: translateY(20px);
  }
  100% {
    opacity: 1;
    transform: translateY(0);
  }
}
.fadeInUp {
  animation-name: fadeInUp;
}

/*==================================================================
    style.css
===================================================================*/
/*==================================================================
    #ymn
===================================================================*/
/*==================================================================
    #ymn common
===================================================================*/
#ymn .ymn-h01 {
  display: flex;
  flex-flow: column nowrap;
  align-items: center;
  padding: 35px;
  font-size: 1.74rem;
  font-weight: 700;
  color: var(--k2);
  border: none;
}
@media screen and (max-width: 768px) {
  #ymn .ymn-h01 {
    font-size: 1.25rem;
    padding: 1.5em 1em;
  }
}
#ymn .ymn-h01 span {
  font-size: 0.6875rem;
  font-weight: 300;
  font-family: var(--font1);
  color: var(--k);
  margin-top: 10px;
}
#ymn .ymn-h01.-photoplus {
  background-color: rgba(225, 225, 234, 0.8);
  margin-bottom: 35px;
}
@media screen and (max-width: 768px) {
  #ymn .ymn-h01.-photoplus {
    margin-bottom: 30px;
  }
}
#ymn .ymn-h01.-bluegreenmask {
  background-color: rgba(212, 224, 224, 0.8);
  margin-bottom: 35px;
}
@media screen and (max-width: 768px) {
  #ymn .ymn-h01.-bluegreenmask {
    margin-bottom: 30px;
  }
}
#ymn .ymn-h01.-facialcare {
  background-color: rgba(234, 230, 219, 0.8);
  margin-bottom: 50px;
}
@media screen and (max-width: 768px) {
  #ymn .ymn-h01.-facialcare {
    margin-bottom: 30px;
  }
}

#ymn .ymn-h02 {
  display: flex;
  flex-flow: column nowrap;
  align-items: center;
  font-size: 1.75rem;
  line-height: 1.6;
  font-weight: 700;
  color: var(--k2);
  border: none;
  padding-bottom: 20px;
  position: relative;
}
@media screen and (max-width: 768px) {
  #ymn .ymn-h02 {
    font-size: 1.25rem;
    padding-bottom: 15px;
  }
}
#ymn .ymn-h02::before {
  display: block;
  content: "";
  width: 108px;
  height: 1px;
  background-color: #5c5c5c;
  position: absolute;
  bottom: 0;
  left: 50%;
  margin-left: -54px;
}
#ymn .ymn-h02 span {
  font-size: 0.875rem;
}

#ymn .ymn-h03 {
  display: flex;
  flex-flow: column nowrap;
  font-size: 2.1875rem;
  line-height: 1.4;
  font-weight: 700;
  color: #746e88;
  border: none;
  margin-bottom: 35px;
}
@media screen and (max-width: 768px) {
  #ymn .ymn-h03 {
    font-size: 1.625rem;
    margin-bottom: 20px;
  }
}
#ymn .ymn-h03 span {
  font-size: 1rem;
  font-weight: 400;
  color: rgba(51, 51, 51, 0.7);
}
@media screen and (max-width: 768px) {
  #ymn .ymn-h03 span {
    font-size: 0.875rem;
  }
}
#ymn .ymn-h03 em {
  font-size: 1rem;
  font-weight: 700;
}
@media screen and (max-width: 768px) {
  #ymn .ymn-h03 em {
    font-size: 0.875rem;
  }
}

#ymn .ymn-h04 {
  font-size: 1.125rem;
  line-height: 1.4;
  font-weight: 700;
  color: var(--k2);
  margin-bottom: 20px;
}
@media screen and (max-width: 768px) {
  #ymn .ymn-h04 {
    font-size: 1rem;
    margin-bottom: 15px;
  }
}

#ymn .ymn-h05 {
  font-size: 1.75rem;
  line-height: 1.4;
  font-weight: 700;
  color: var(--k2);
  text-align: center;
  padding: 1.4em;
  border-top: solid 1px rgba(92, 92, 92, 0.2);
  border-bottom: solid 1px rgba(92, 92, 92, 0.2);
  margin-bottom: 50px;
}
@media screen and (max-width: 768px) {
  #ymn .ymn-h05 {
    font-size: 1.25rem;
  }
}

#ymn .ymn-caution p {
  font-size: 0.625rem;
  line-height: 1.6;
  text-align: left;
}

#ymn .ymn-goods {
  padding-bottom: 100px;
}
@media screen and (max-width: 768px) {
  #ymn .ymn-goods {
    padding-bottom: 60px;
  }
}
#ymn .ymn-goods_list {
  display: flex;
  flex-flow: row nowrap;
  justify-content: center;
  margin-bottom: 15px;
}
@media screen and (max-width: 768px) {
  #ymn .ymn-goods_list {
    flex-flow: column nowrap;
    padding: 0 4vw;
  }
}
#ymn .ymn-goods_list-item {
  width: 31.6666666667%;
  border-radius: 10px;
  box-shadow: 0px 0px 2px rgba(0, 0, 0, 0.16);
}
@media screen and (max-width: 768px) {
  #ymn .ymn-goods_list-item {
    width: 100%;
  }
}
#ymn .ymn-goods_list-item:not(:last-of-type) {
  margin-right: 2.5%;
}
@media screen and (max-width: 768px) {
  #ymn .ymn-goods_list-item:not(:last-of-type) {
    margin-right: 0;
    margin-bottom: 10px;
  }
}

/*==================================================================
    #ymn .ymn-hero
===================================================================*/
#ymn .ymn-hero {
  padding-bottom: 20px;
}
#ymn .ymn-hero_img {
  margin-bottom: 10px;
}
@media screen and (max-width: 768px) {
  #ymn .ymn-hero_img img {
    width: 100%;
  }
}

/*==================================================================
    #ymn .ymn-lead
===================================================================*/
#ymn .ymn-lead {
  padding-bottom: 70px;
}
@media screen and (max-width: 768px) {
  #ymn .ymn-lead {
    padding-bottom: 50px;
  }
}
#ymn .ymn-lead_blocks {
  background-color: #f8f8f4;
  padding: 3.3333333333% 0 0.8333333333%;
  margin-bottom: 40px;
}
@media screen and (max-width: 768px) {
  #ymn .ymn-lead_blocks {
    padding: 5.3333333333vw 4vw;
    margin-bottom: 25px;
  }
}
#ymn .ymn-lead_blocks .ymn-blocks {
  display: flex;
  flex-flow: row nowrap;
  align-items: center;
  justify-content: center;
}
@media screen and (max-width: 768px) {
  #ymn .ymn-lead_blocks .ymn-blocks {
    flex-flow: column nowrap;
  }
}
#ymn .ymn-lead_blocks .ymn-blocks_l {
  margin-right: 15px;
}
@media screen and (max-width: 768px) {
  #ymn .ymn-lead_blocks .ymn-blocks_l {
    margin-right: 0;
    margin-bottom: 30px;
  }
}
#ymn .ymn-lead_blocks .ymn-blocks_l p {
  font-size: 1rem;
  line-height: 2;
  text-align: left;
}
@media screen and (max-width: 768px) {
  #ymn .ymn-lead_blocks .ymn-blocks_l p {
    font-size: 0.875rem;
  }
}
#ymn .ymn-lead_blocks .ymn-blocks_r {
  width: 37.0833333333%;
}
@media screen and (max-width: 768px) {
  #ymn .ymn-lead_blocks .ymn-blocks_r {
    width: 100%;
  }
}
#ymn .ymn-lead_links .ymn-links {
  display: flex;
  flex-flow: row nowrap;
  justify-content: center;
  align-items: center;
}
@media screen and (max-width: 768px) {
  #ymn .ymn-lead_links .ymn-links {
    flex-flow: column nowrap;
  }
}
#ymn .ymn-lead_links .ymn-links_item {
  width: 28.3333333333%;
}
@media screen and (max-width: 768px) {
  #ymn .ymn-lead_links .ymn-links_item {
    width: 100%;
  }
}
#ymn .ymn-lead_links .ymn-links_item:not(:last-of-type) {
  margin-right: 10px;
}
@media screen and (max-width: 768px) {
  #ymn .ymn-lead_links .ymn-links_item:not(:last-of-type) {
    margin-right: 0;
    margin-bottom: 5px;
  }
}

/*==================================================================
    #ymn .ymn-photoplus
===================================================================*/
#ymn .ymn-photoplus_hero {
  padding-bottom: 50px;
}
@media screen and (max-width: 768px) {
  #ymn .ymn-photoplus_hero {
    padding-bottom: 30px;
  }
}
#ymn .ymn-photoplus_hero-img {
  margin-bottom: 10px;
}
@media screen and (max-width: 768px) {
  #ymn .ymn-photoplus_hero-img img {
    width: 100%;
  }
}
#ymn .ymn-photoplus_outline {
  padding-bottom: 100px;
}
@media screen and (max-width: 768px) {
  #ymn .ymn-photoplus_outline {
    padding-bottom: 50px;
  }
}
#ymn .ymn-photoplus_outline-img {
  margin-bottom: 10px;
}
@media screen and (max-width: 768px) {
  #ymn .ymn-photoplus_outline-img img {
    width: 100%;
  }
}
#ymn .ymn-photoplus_tech .ymn-h02 {
  margin-bottom: 50px;
}
@media screen and (max-width: 768px) {
  #ymn .ymn-photoplus_tech .ymn-h02 {
    margin-bottom: 30px;
  }
}
#ymn .ymn-photoplus_tech .ymn-flex {
  display: flex;
  flex-flow: row nowrap;
  align-items: center;
}
@media screen and (max-width: 768px) {
  #ymn .ymn-photoplus_tech .ymn-flex {
    flex-flow: column nowrap;
  }
}
#ymn .ymn-photoplus_tech .ymn-flex_l {
  width: 50%;
  padding: 0 5.4166666667%;
}
@media screen and (max-width: 768px) {
  #ymn .ymn-photoplus_tech .ymn-flex_l {
    width: 100%;
    padding: 0 4vw;
    margin-bottom: 20px;
  }
}
#ymn .ymn-photoplus_tech .ymn-flex_l .ymn-txt p {
  font-size: 0.875rem;
  line-height: 1.8;
  text-align: left;
}
#ymn .ymn-photoplus_tech .ymn-flex_l .ymn-caution {
  margin-top: 20px;
}
#ymn .ymn-photoplus_tech .ymn-flex_l .ymn-icon {
  text-align: left;
  margin-top: 10px;
}
#ymn .ymn-photoplus_tech .ymn-flex_r {
  width: 50%;
}
@media screen and (max-width: 768px) {
  #ymn .ymn-photoplus_tech .ymn-flex_r {
    width: 100%;
    padding: 0 4vw;
  }
}
#ymn .ymn-photoplus_tech .ymn-flex_r .annotation {
  display: block;
  text-align: left;
  padding-top: 10px;
  font-size: 0.75rem;
}
#ymn .ymn-photoplus_tech-blocks01 {
  padding-bottom: 80px;
}
@media screen and (max-width: 768px) {
  #ymn .ymn-photoplus_tech-blocks01 {
    padding-bottom: 50px;
  }
}
#ymn .ymn-photoplus_tech-blocks01 .ymn-flex {
  margin-bottom: 45px;
}
@media screen and (max-width: 768px) {
  #ymn .ymn-photoplus_tech-blocks01 .ymn-flex {
    margin-bottom: 30px;
  }
}
#ymn .ymn-photoplus_tech-blocks01 .ymn-dwhp_img {
  margin-bottom: 15px;
}
#ymn .ymn-photoplus_tech-blocks02 {
  padding-bottom: 90px;
}
@media screen and (max-width: 768px) {
  #ymn .ymn-photoplus_tech-blocks02 {
    padding-bottom: 50px;
  }
}
#ymn .ymn-photoplus_tech-blocks02 .ymn-flex:nth-of-type(1) {
  margin-bottom: 60px;
}
@media screen and (max-width: 768px) {
  #ymn .ymn-photoplus_tech-blocks02 .ymn-flex:nth-of-type(1) {
    margin-bottom: 50px;
  }
}
#ymn .ymn-photoplus_cosme {
  padding-bottom: 65px;
}
@media screen and (max-width: 768px) {
  #ymn .ymn-photoplus_cosme {
    padding-bottom: 40px;
  }
}
#ymn .ymn-photoplus_cosme-first {
  margin-bottom: 85px;
}
@media screen and (max-width: 768px) {
  #ymn .ymn-photoplus_cosme-first {
    margin-bottom: 40px;
  }
}
#ymn .ymn-photoplus_cosme-first .ymn-img {
  margin-bottom: 12px;
}
@media screen and (max-width: 768px) {
  #ymn .ymn-photoplus_cosme-first .ymn-img img {
    width: 100%;
  }
}
#ymn .ymn-photoplus_cosme-second .ymn-img {
  margin-bottom: 12px;
}
@media screen and (max-width: 768px) {
  #ymn .ymn-photoplus_cosme-second .ymn-img img {
    width: 100%;
  }
}

/*==================================================================
    #ymn .ymn-mask
===================================================================*/
#ymn .ymn-mask_hero {
  padding-bottom: 50px;
}
@media screen and (max-width: 768px) {
  #ymn .ymn-mask_hero {
    padding-bottom: 30px;
  }
}
#ymn .ymn-mask_hero-img {
  margin-bottom: 10px;
}
@media screen and (max-width: 768px) {
  #ymn .ymn-mask_hero-img img {
    width: 100%;
  }
}
#ymn .ymn-mask_lead {
  padding-bottom: 100px;
}
@media screen and (max-width: 768px) {
  #ymn .ymn-mask_lead {
    padding-bottom: 50px;
  }
  #ymn .ymn-mask_lead img {
    width: 100%;
  }
}
#ymn .ymn-mask_feature {
  padding-bottom: 125px;
}
@media screen and (max-width: 768px) {
  #ymn .ymn-mask_feature {
    padding-bottom: 60px;
  }
}
#ymn .ymn-mask_feature .ymn-h02 {
  margin-bottom: 55px;
}
@media screen and (max-width: 768px) {
  #ymn .ymn-mask_feature .ymn-h02 {
    margin-bottom: 30px;
  }
}
#ymn .ymn-mask_feature .ymn-flex01 {
  display: flex;
  flex-flow: row nowrap;
  align-items: center;
  justify-content: center;
}
@media screen and (max-width: 768px) {
  #ymn .ymn-mask_feature .ymn-flex01 {
    flex-flow: column nowrap;
  }
}
#ymn .ymn-mask_feature .ymn-flex01_l {
  width: 31.6666666667%;
  margin-right: 5%;
}
@media screen and (max-width: 768px) {
  #ymn .ymn-mask_feature .ymn-flex01_l {
    width: 100%;
    margin-right: 0;
    margin-bottom: 30px;
  }
}
#ymn .ymn-mask_feature .ymn-flex01_l img {
  border-radius: 0.625rem;
}
@media screen and (max-width: 768px) {
  #ymn .ymn-mask_feature .ymn-flex01_l img {
    width: 100%;
  }
}
#ymn .ymn-mask_feature .ymn-flex01_r {
  width: 50%;
}
@media screen and (max-width: 768px) {
  #ymn .ymn-mask_feature .ymn-flex01_r {
    width: 100%;
  }
}
#ymn .ymn-mask_feature .ymn-flex01_r .ymn-ttl {
  width: 63.3333333333%;
  border: none;
  margin-bottom: 40px;
}
@media screen and (max-width: 768px) {
  #ymn .ymn-mask_feature .ymn-flex01_r .ymn-ttl {
    width: 100%;
    margin-bottom: 25px;
  }
  #ymn .ymn-mask_feature .ymn-flex01_r .ymn-ttl img {
    max-width: 300px;
  }
}
#ymn .ymn-mask_feature .ymn-flex01_r .ymn-txt p {
  font-size: 1.2rem;
  text-align: left;
  line-height: 1.6;
}
@media screen and (max-width: 768px) {
  #ymn .ymn-mask_feature .ymn-flex01_r .ymn-txt p {
    font-size: 1rem;
  }
}
#ymn .ymn-mask_feature .ymn-flex01_r .ymn-txt p span {
  color: #597eb2;
  font-weight: 600;
}
#ymn .ymn-mask_feature .ymn-flex01.-ptn02 .ymn-flex01_r .ymn-txt p span {
  color: #2f998b;
}
#ymn .ymn-mask_feature .ymn-flex02 {
  display: flex;
  flex-flow: row nowrap;
  align-items: center;
  justify-content: center;
}
@media screen and (max-width: 768px) {
  #ymn .ymn-mask_feature .ymn-flex02 {
    flex-flow: column nowrap;
  }
}
#ymn .ymn-mask_feature .ymn-flex02_l {
  width: 46%;
  margin-right: 3.3333333333%;
  text-align: left;
}
@media screen and (max-width: 768px) {
  #ymn .ymn-mask_feature .ymn-flex02_l {
    width: 100%;
    margin-right: 0;
    margin-bottom: 20px;
  }
}
#ymn .ymn-mask_feature .ymn-flex02_l .ymn-ttl {
  display: inline-block;
  font-size: 1.375rem;
  line-height: 1.6;
  font-weight: 600;
  color: #597eb2;
  border-bottom: 1px #597eb2 solid;
  border-left: none;
  padding-bottom: 0.625rem;
  margin-bottom: 1.875rem;
}
@media screen and (max-width: 768px) {
  #ymn .ymn-mask_feature .ymn-flex02_l .ymn-ttl {
    font-size: 1.125rem;
    margin-bottom: 1.25rem;
  }
}
#ymn .ymn-mask_feature .ymn-flex02_l .ymn-txt p {
  font-size: 1rem;
  text-align: left;
  line-height: 1.6;
}
@media screen and (max-width: 768px) {
  #ymn .ymn-mask_feature .ymn-flex02_l .ymn-txt p {
    font-size: 0.875rem;
  }
}
#ymn .ymn-mask_feature .ymn-flex02_r {
  width: 30.6666666667%;
}
@media screen and (max-width: 768px) {
  #ymn .ymn-mask_feature .ymn-flex02_r {
    width: 100%;
  }
}
#ymn .ymn-mask_feature .ymn-flex03 {
  display: flex;
  flex-flow: row nowrap;
  align-items: center;
  justify-content: center;
}
@media screen and (max-width: 768px) {
  #ymn .ymn-mask_feature .ymn-flex03 {
    flex-flow: column nowrap;
  }
}
#ymn .ymn-mask_feature .ymn-flex03_l {
  width: 40.8333333333%;
  margin-right: 5%;
}
@media screen and (max-width: 768px) {
  #ymn .ymn-mask_feature .ymn-flex03_l {
    width: 100%;
    margin-right: 0;
    margin-bottom: 20px;
  }
}
#ymn .ymn-mask_feature .ymn-flex03_r {
  width: 31.6666666667%;
  text-align: left;
}
@media screen and (max-width: 768px) {
  #ymn .ymn-mask_feature .ymn-flex03_r {
    width: 100%;
  }
}
#ymn .ymn-mask_feature .ymn-flex03_r .ymn-ttl {
  font-size: 1.2rem;
  line-height: 1.6;
  color: #2f998b;
  font-weight: 600;
  padding-bottom: 0.625rem;
  border: none;
}
@media screen and (max-width: 768px) {
  #ymn .ymn-mask_feature .ymn-flex03_r .ymn-ttl {
    font-size: 1rem;
  }
}
#ymn .ymn-mask_feature .ymn-flex03_r .ymn-txt p {
  font-size: 1.1rem;
  text-align: left;
  line-height: 1.6;
}
@media screen and (max-width: 768px) {
  #ymn .ymn-mask_feature .ymn-flex03_r .ymn-txt p {
    font-size: 0.875rem;
  }
}
#ymn .ymn-mask_feature-blocks01 {
  margin-bottom: 35px;
  padding: 3.75% 0;
  background-color: rgba(89, 126, 178, 0.2);
}
@media screen and (max-width: 768px) {
  #ymn .ymn-mask_feature-blocks01 {
    padding: 8vw 4vw;
    margin-bottom: 30px;
  }
}
#ymn .ymn-mask_feature-blocks02 {
  margin-bottom: 30px;
}
@media screen and (max-width: 768px) {
  #ymn .ymn-mask_feature-blocks02 img {
    width: 100%;
  }
}
#ymn .ymn-mask_feature-blocks03 {
  margin-bottom: 40px;
  padding: 7.0833333333% 0;
  background-color: #dee5f0;
}
@media screen and (max-width: 768px) {
  #ymn .ymn-mask_feature-blocks03 {
    padding: 8vw 4vw;
    margin-bottom: 30px;
  }
}
#ymn .ymn-mask_feature-blocks04 {
  padding: 3.75% 0;
  background-color: rgba(89, 175, 178, 0.2);
}
@media screen and (max-width: 768px) {
  #ymn .ymn-mask_feature-blocks04 {
    padding: 8vw 4vw;
  }
}
#ymn .ymn-mask_feature-blocks04 .ymn-flex01 {
  margin-bottom: 50px;
}
@media screen and (max-width: 768px) {
  #ymn .ymn-mask_feature-blocks04 .ymn-flex01 {
    margin-bottom: 30px;
  }
}
#ymn .ymn-mask_expt .ymn-h02 {
  margin-bottom: 85px;
}
@media screen and (max-width: 768px) {
  #ymn .ymn-mask_expt .ymn-h02 {
    margin-bottom: 30px;
  }
}
#ymn .ymn-mask_expt .ymn-graph {
  display: flex;
  flex-flow: row nowrap;
  justify-content: center;
  margin-bottom: 70px;
}
@media screen and (max-width: 768px) {
  #ymn .ymn-mask_expt .ymn-graph {
    flex-flow: column nowrap;
    margin-bottom: 40px;
  }
}
#ymn .ymn-mask_expt .ymn-graph_l {
  width: 38.6666666667%;
  margin-right: 6.8333333333%;
}
@media screen and (max-width: 768px) {
  #ymn .ymn-mask_expt .ymn-graph_l {
    width: 100%;
    margin-right: 0;
    margin-bottom: 40px;
  }
  #ymn .ymn-mask_expt .ymn-graph_l img {
    width: 100%;
  }
}
#ymn .ymn-mask_expt .ymn-graph_r {
  width: 38.6666666667%;
}
@media screen and (max-width: 768px) {
  #ymn .ymn-mask_expt .ymn-graph_r {
    width: 100%;
  }
  #ymn .ymn-mask_expt .ymn-graph_r img {
    width: 100%;
  }
}
#ymn .ymn-mask_expt .ymn-outline {
  width: 84.1666666667%;
  margin: 0 auto;
  text-align: left;
}
@media screen and (max-width: 768px) {
  #ymn .ymn-mask_expt .ymn-outline {
    width: 100%;
  }
}
#ymn .ymn-mask_expt .ymn-outline dl {
  font-size: 0.75rem;
  line-height: 1.6;
}
#ymn .ymn-mask_expt .ymn-outline dl dt {
  font-weight: 600;
  margin-bottom: 0.625rem;
}
#ymn .ymn-mask_expt-blocks01 {
  padding-bottom: 100px;
}
@media screen and (max-width: 768px) {
  #ymn .ymn-mask_expt-blocks01 {
    padding: 0 4vw 50px;
  }
}
#ymn .ymn-mask_expt-blocks01 .ymn-ttl {
  width: 53.3333333333%;
  margin: 0 auto 70px;
  border: none;
}
@media screen and (max-width: 768px) {
  #ymn .ymn-mask_expt-blocks01 .ymn-ttl {
    width: 100%;
    max-width: 640px;
    margin: 0 auto 40px;
  }
}
#ymn .ymn-mask_expt-blocks02 {
  padding-bottom: 70px;
}
@media screen and (max-width: 768px) {
  #ymn .ymn-mask_expt-blocks02 {
    padding: 0 4vw 50px;
  }
}
#ymn .ymn-mask_expt-blocks02 .ymn-ttl {
  width: 44.3333333333%;
  margin: 0 auto 78px;
  border: none;
}
@media screen and (max-width: 768px) {
  #ymn .ymn-mask_expt-blocks02 .ymn-ttl {
    width: 100%;
    max-width: 532px;
    margin: 0 auto 40px;
  }
}
#ymn .ymn-mask_expt-blocks02 .ymn-outline dl {
  margin-bottom: 30px;
}
@media screen and (max-width: 768px) {
  #ymn .ymn-mask_expt-blocks02 .ymn-outline dl {
    margin-bottom: 20px;
  }
}

/*==================================================================
    #ymn .ymn-facialcare
===================================================================*/
#ymn .ymn-facialcare {
  padding-bottom: 150px;
}
@media screen and (max-width: 768px) {
  #ymn .ymn-facialcare {
    padding-bottom: 60px;
  }
}
#ymn .ymn-facialcare_img .ymn-img {
  margin-bottom: 25px;
}

/*==================================================================
    #ymn .ymn-category
===================================================================*/
#ymn .ymn-category {
  padding-bottom: 100px;
}
@media screen and (max-width: 768px) {
  #ymn .ymn-category {
    padding-bottom: 60px;
  }
}
@media screen and (max-width: 768px) {
  #ymn .ymn-category_list {
    padding: 0 4vw;
  }
}
#ymn .ymn-category_list .ymn-list {
  display: flex;
  flex-flow: row wrap;
}
@media screen and (max-width: 768px) {
  #ymn .ymn-category_list .ymn-list {
    flex-flow: column nowrap;
  }
}
#ymn .ymn-category_list .ymn-list_item {
  width: 48.8333333333%;
  margin-bottom: 30px;
}
@media screen and (max-width: 768px) {
  #ymn .ymn-category_list .ymn-list_item {
    width: 100%;
    margin-bottom: 10px;
  }
}
#ymn .ymn-category_list .ymn-list_item:nth-of-type(odd) {
  margin-right: 28px;
}
@media screen and (max-width: 768px) {
  #ymn .ymn-category_list .ymn-list_item:nth-of-type(odd) {
    margin-right: 0;
  }
}


