/*--------------------------------------------------------------------------------------------------

   second

--------------------------------------------------------------------------------------------------*/
.sp {
  display: none; }

.pc {
  display: block; }

@media all and (max-width: 1100px) {
  .l-header__menu li {
    margin-right: 15px; }

  .l-header__links li {
    margin-left: 20px; }

  .slick-slide img {
    width: 100%; }

  .l-header__links li {
    margin-left: 20px; } }
@media all and (max-width: 959px) {
  .sp {
    display: block; }

  .pc {
    display: none; }

  body {
    font-size: 12px; }
		
		.l-header {
			height: auto;
		}

  .l-header__banner {
    height: 772px;
    background: url(../image/banner-sp.jpg) no-repeat center center;
    background-size: cover;
    padding-top: 162px; }
    .l-header__banner__text {
      margin-top: 35px;
      font-size: 13px; }
  .l-header .menubt {
    width: 43px;
    height: 43px;
    border-radius: 12px;
    top: -30px;
    right: 5%;
    background-color: #efe8dc;
    display: block;
    position: absolute;
    z-index: 10000;
    cursor: pointer;
    -webkit-transition: 0.8s ease-in-out;
    -moz-transition: 0.8s ease-in-out;
    -o-transition: 0.8s ease-in-out;
    transition: 0.8s ease-in-out; }
    .l-header .menubt span {
      display: block;
      background: #cbb48b;
      border-radius: 0;
      position: absolute;
      top: 20px;
      transition: all 0.4s;
      transform: rotate(0deg);
      width: 15px;
      height: 3px;
      border-radius: 3px;
      right: 14px; }
    .l-header .menubt .top {
      -webkit-transform: translateY(-200%);
      -ms-transform: translateY(-200%);
      transform: translateY(-200%); }
    .l-header .menubt .bottom {
      -webkit-transform: translateY(200%);
      -ms-transform: translateY(200%);
      transform: translateY(200%); }
    .l-header .menubt .menuclick1 {
      transform: rotate(-215deg); }
    .l-header .menubt .menuclick2 {
      background-color: rgba(255, 255, 255, 0); }
    .l-header .menubt .menuclick3 {
      transform: rotate(215deg); }
  .l-header nav {
    height: auto;
    position: relative; }
    .l-header nav .l-wrapper {
      width: 100%;
      max-width: 100%; }
  .l-header__right {
    position: absolute;
    top: 40px;
    z-index: 1000;
    background-color: #efe8dc;
    width: 100%;
    display: none; }
  .l-header__menu {
    display: block; }
    .l-header__menu li {
      width: 100%;
      padding: 10px;
      border-bottom: 1px solid #fff; }
						.l-header__links {
							justify-content: center;
						}
  .l-header__links li {
    width: auto;
    padding: 20px 0;
				margin: 0 10px;
			}
    .l-header__links li img {
      height: 80px; }
    .l-header__links li:first-child img {
      height: 35px; }
						.l-header__links li:last-child {
							margin-left: 10px;
						}

  .c-btn {
    display: inline-block;
    text-align: center;
    letter-spacing: 2.5px; }
    .c-btn--gray {
      padding: 7px 35px 7px 12px;
      border-radius: 30px;
      font-size: 12px;
      color: #7d6e72;
      background: #FFF url(../image/icon-dot-gray.png) no-repeat right 20px center;
      background-size: 14px auto; }
    .c-btn--red {
      padding: 10px 70px;
      border-radius: 40px;
      font-size: 12px;
      color: #c10000;
      background: url(../image/icon-dot-red.png) no-repeat right 35px center #FFF;
      background-size: 16px auto; }
    .c-btn--white {
      padding: 7px 35px 7px 12px;
      border-radius: 30px;
      font-size: 12px;
      color: #83777a;
      border: 2px solid #7d6e72;
      background: #fff url(../image/icon-dot.png) no-repeat right 20px center;
      background-size: 14px auto; }
						.c-btn--gray:hover {
	color: #FFF;
	background: #7d6e72 url(../image/icon-dot.png) no-repeat right 20px center;
	 background-size: 14px auto; }

.c-btn--red:hover {
    color: #FFF;
    background: url(../image/icon-dot.png) no-repeat right 35px center #c10000;
				 background-size: 14px auto; }


  .p-heading {
    text-align: center; }
    .p-heading span {
      font-size: 16px;
      padding: 0 15px 5px 16px; }
    .p-heading--white span {
      color: #c0272d;
      border-bottom: 1px solid #fff;
      display: inline-block;
      position: relative; }
      .p-heading--white span::after {
        content: "";
        position: absolute;
        right: -8px;
        bottom: 0;
        width: 8px;
        height: 15px;
        bottom: -1px;
        background: url("../image/icon-heading-white.png") no-repeat right bottom;
        background-size: 8px auto; }
    .p-heading--red span {
      color: #c0272d;
      border-bottom: 1px solid #dc6f73;
      display: inline-block;
      position: relative; }
      .p-heading--red span::after {
        content: "";
        position: absolute;
        right: -4px;
        bottom: 0;
        width: 4px;
        height: 7px;
        bottom: -1px;
        background: url("../image/icon-heading-red.png") no-repeat right bottom;
        background-size: 4px auto; }
						.menu-fixed {
							height: auto;
						}

  /*------------------------------------------------------------------------------------------------
  footer
--------------------------------------------------------------------------------------------------*/
  .l-footer__contact {
    padding: 35px 0 84px 0;
    background: url(../image/bg-contact-footer.png) no-repeat center bottom 35px;
    background-size: auto 37px; }
    .l-footer__contact__list {
      flex-direction: column; }
      .l-footer__contact__list li {
        margin: 0 auto 16px auto; }
    .l-footer__contact__item-red a {
      width: 145px;
      text-align: center;
      height: 145px;
      border: 2px solid #b4282c;
      box-shadow: 7px 7px 7px #ccc;
      border-radius: 50%;
      padding-top: 40px;
      background: url("../image/icon-square--red-top.png") no-repeat center bottom 30px;
      background-size: 65px auto;
      line-height: 1.3;
      font-size: 13px;
      letter-spacing: 2.5px;
      color: #c12e34; }
    .l-footer__contact__item-yellow a {
      width: 145px;
      text-align: center;
      height: 145px;
      border: 2px solid #f0c22b;
      box-shadow: 7px 7px 7px #ccc;
      border-radius: 50%;
      padding-top: 40px;
      background: url("../image/icon-square--yellow-top.png") no-repeat center bottom 30px;
      background-size: 65px auto;
      line-height: 1.3;
      font-size: 13px;
      letter-spacing: 2.5px;
      color: #6e6a61; }
  .l-footer__info {
    padding: 35px 0 40px 0; }
  .l-footer__logo {
    margin-bottom: 0; }
    .l-footer__logo img {
      width: 170px; }
  .l-footer__menu {
    display: none; }

  /*--------------------------------------------------------------------------------------------
    index
  --------------------------------------------------------------------------------------------*/
		main {
			padding: 0;
		}
		
		#topbaby {
 width: 100vw;
 height: 100vh;
 transition: all 1s;
 position: fixed;
 top: 0;
 left: 0;
 z-index: 99999;
 display: flex;
	background: url(../image/banner-sp.jpg) no-repeat center center;
	background-size: cover;
}

		#topbaby::before {
 position: absolute;
 top: 50%;
    left: 50%;
    transform: translate(-50%, -50%);
    -webkit-transform: translate(-50%, -50%);
    -ms-transform: translate(-50%, -50%);
	display: block;
 content: "";
 opacity: 0;
	background: url(../image/top_text.png);
	background-size: 140px 255px;
	animation: fadein 3s forwards;
	animation-delay:1s;
	width: 140px;
	height: 255px;
}

		
  .p-slideshow {
    margin-top: 30px; }

  .p-frame1-top {
    padding: 33px 0; }
    .p-frame1-top__title {
      margin-left: 8px; }
      .p-frame1-top__title img {
        height: 135px; }
    .p-frame1-top__mess {
      font-size: 13px;
      margin-left: 32px;
						line-height: 1.6; }
				.p-frame1-top__mess img {
					width: 37px;
					height: 205px;
				}
    .p-frame1-top__desc {
      font-size: 11px; }
    .p-frame1-top__shop {
      bottom: unset;
      top: -65px;
      right: 4.4%; }
      .p-frame1-top__shop img {
        height: 78px; }

  .p-frame2-top {
    padding: 30px 0;
    background: #fffaeb; }
    .p-frame2-top__list {
      margin-top: 33px;
      padding-bottom: 0; }
      .p-frame2-top__list li {
        display: block;
        margin-bottom: 32px; }
        .p-frame2-top__list li:nth-child(2n+0) .p-frame2-top__text {
          text-align: center; }
        .p-frame2-top__list li:first-child .p-frame2-top__desc {
          font-size: 13px; }
    .p-frame2-top__photo {
      width: 100%; }
      .p-frame2-top__photo img {
        width: auto;
        max-width: 100%; }
    .p-frame2-top__text {
      text-align: center;
      width: 100%; }
    .p-frame2-top h3 {
      font-size: 14px;
      margin-top: 12px;
      margin-bottom: 6px;
						line-height: 1.4; }
    .p-frame2-top__desc {
      font-size: 12px;
      margin-bottom: 0; }
      .p-frame2-top__desc:last-of-type {
        margin-bottom: 0; }
    .p-frame2-top__link-item {
      margin-top: 15px; }
						
						.p-frame1-top__shop.fixed {
							position: fixed;
							top: inherit;
							bottom: 20px;
						}

  .p-frame3-top {
    padding: 33px 0 0px 0; }
    .p-frame3-top__intro {
      margin: 15px 0 10px 0;
      font-size: 12px; }
    .p-frame3-top__list li {
      display: block;
      margin-bottom: 35px; }
      .p-frame3-top__list li:first-child .p-frame3-top__text {
        background: url(../image/icon-square--red-top.png) no-repeat center top;
        background-size: 42px auto; }
    .p-frame3-top__photo {
      width: 100%;
      margin-right: 0;
      margin-bottom: 18px; }
				.p-frame3-top__photo img {
					display: block;
					margin: 0 auto;
				}
 			.p-frame3-top__photo img.no1 {
					 width: 80%;
				}
    .p-frame3-top__text {
      width: 100%;
      padding-top: 17px;
      text-align: center;
      background: url(../image/icon-square--yellow-top.png) no-repeat center top;
      background-size: 42px auto; }
    .p-frame3-top h3 {
      font-size: 14px;
      margin-bottom: 15px;
						line-height: 1.4; }
    .p-frame3-top__desc {
      font-size: 12px;
      margin-bottom: 29px; }
    .p-frame3-top__btn {
      text-align: center; }
    .p-frame3-top .c-btn {
      margin-right: 0; }

  .p-frame4-top {
    width: 100%;
    height: 283px;
    padding-top: 1px;
    background: url(../image/bg-online-shop-sp.png) no-repeat center center;
    background-size: cover; }
    .p-frame4-top .l-wrapper {
      display: block;
      text-align: center; }
    .p-frame4-top__title {
      width: auto;
      margin-top: 35px;
      margin-right: auto;
      writing-mode: inherit;
      font-size: 14px;
      letter-spacing: 2.5px;
      display: block; }
    .p-frame4-top__link {
      width: auto;
      padding: 4px 43px 4px 13px;
      background: url(../image/icon-dot-gray.png) no-repeat right 22px center #FFF;
      background-size: 12px auto;
      border-radius: 8px;
      writing-mode: inherit;
      display: inline-block;
      margin-top: 13px;
      font-size: 10px;
      margin-right: 0;
      color: #83777a; }
						.p-frame4-top__link:hover {
			background: #83777a url(../image/icon-dot.png) no-repeat right 22px center;
			color: #FFF;
			opacity: 1;
			      background-size: 12px auto;

		}


  .p-frame5-top {
    padding: 35px 0 35px 0; }
    .p-frame5-top__list {
      flex-wrap: wrap;
      margin: 33px 0 0 0; }
      .p-frame5-top__list li {
        width: calc(50% - 7px);
        margin-bottom: 17px; }
        .p-frame5-top__list li img {
          max-width: 100%; }

  .p-frame6-top {
    height: auto;
    margin-top: 80px;
    padding: 35px 0;
    background: url(../image/bg-yuko-top-sp.jpg) no-repeat center center;
    background-size: cover; }
    .p-frame6-top .l-wrapper {
      justify-content: center;
      align-items: center;
      position: relative; }
    .p-frame6-top__title {
      font-size: 14px;
      text-align: center; }
    .p-frame6-top__photo {
      margin: 0;
      position: absolute;
      right: -2%; }
      .p-frame6-top__photo img {
        width: 150px; }

  .p-slideshow {
    position: relative;
    display: block;
    width: 90%;
    margin: 67px auto 0 auto; }
    .p-slideshow .fade {
      width: 100%;
      overflow: hidden;
      visibility: hidden; }
      .p-slideshow .fade.slick-initialized {
        visibility: visible;
        display: block; }
      .p-slideshow .fade .slick-slide {
        display: inline-block;
        position: relative;
        height: 100%; }
        .p-slideshow .fade .slick-slide img {
          display: inline-block;
          position: relative;
          width: 100%;
          height: 100%; }
										
.l-header__banner .text {
	height: auto;
}


}

/*# sourceMappingURL=mobile.css.map */