/* ================================================
   Pure.css用リセットCSS（Bootstrap Rebootの代替）
   ================================================ */

/* Pure.cssのグリッドでのbox-sizingをborder-boxに統一 */
*,
*::before,
*::after {
    box-sizing: border-box;
}

/* Pure.cssのグリッドクラスのfloatをリセット */
[class*="pure-u"] {
    box-sizing: border-box;
}

/* Pure.cssのグリッドでのネガティブマージンを調整 */
.pure-g {
    letter-spacing: normal;
}

/* ================================================
   BASIC
   ================================================ */

body {
    background-color: #f7f1f3;
    font-family: "Helvetica Neue", Helvetica, Arial, "游ゴシック体", "Yu Gothic", YuGothic, "Hiragino Kaku Gothic ProN", Meiryo, sans-serif;
    min-width: 380px;
    margin-top: 70px
}

/* ankerリンク対応 */
#testflow {
    scroll-margin-top: 70px;
}

#cosmetic {
    scroll-margin-top: 70px;
}

#helthy-food {
    scroll-margin-top: 70px;
}

#treatment {
    scroll-margin-top: 70px;
}

#clothes {
    scroll-margin-top: 70px;
}

#ad-pic {
    scroll-margin-top: 70px;
}

#qa {
    scroll-margin-top: 70px;
}

#qa1, #qa2, #qa3, #qa4, #qa5 {
    scroll-margin-top: 70px;
}

#com-profile {
    scroll-margin-top: 70px;
}

#inquiry {
    scroll-margin-top: 70px;
}

@media (min-width: 768px) {}

@media (max-width: 767px) {}

video.vid_main {
    width: 100%;
    max-width: 920px;
    /*PC版での最大幅*/
}


footer {
    background: #c4c4c4;
    padding: 2% 0;
}

.starter-template {
    padding: 3rem 1.5rem;
    text-align: center;
}

.copy {
    display: block;
}

a:link {
    color: #212529;
}

/*未訪問のリンクの色*/
a:visited {
    color: #212529;
}

/*訪問済みのリンクの色*/
a:hover {
    text-decoration: none;
}

a:active {
    color: #212529;
}

/*クリック中のリンクの色*/

a object {
    pointer-events: none;
}

/* nav font size */
@media (min-width: 576px) {
    .fs-nav {
        font-size: 0.88rem !important;
    }
}

@media (min-width: 768px) {
    .fs-nav {
        font-size: 0.88rem !important;
    }
}

@media (min-width: 992px) {
    .fs-nav {
        font-size: 1.5rem !important;
    }
}

@media (min-width: 1200px) {
    .fs-nav {
        font-size: 0.76rem !important;
    }
}

@media (min-width: 1400px) {
    .fs-nav {
        font-size: 0.88rem !important;
    }
}



.double-line {
    width: 160px;
}

.text-indent1 {
    text-indent: 1em;
}

p.indent-1 {
    padding-left: 1em;
    text-indent: -1em;
}

.list-decimal {
    list-style-type: decimal
}

.list-none {
    list-style-type: none
}

.upper-roman {
    list-style-type: upper-roman;
}

.lower-roman {
    list-style-type: lower-roman;
}

.disk {
    list-style-type: disc
}

/* slider */
@media (max-width: 768px) {
    .carousel-inner .carousel-item > div {
        display: none;
        width: 80%;
        text-align: center;
        margin-left: 10%;
    }

    .carousel-inner .carousel-item > div:first-child {
        display: block;
    }
}

.carousel-inner .carousel-item.active,
.carousel-inner .carousel-item-start,
.carousel-inner .carousel-item-next,
.carousel-inner .carousel-item-prev {
    display: flex;
}

/* indicator */
/*
#carouselMulti .carousel-control-prev-icon, 
#carouselMulti .carousel-control-next-icon {
    height: 20px;
    width: 20px;
    margin-top: 50px;
    outline: black;
    background-color: rgba(237, 20, 89, 0.3);
    background-size: 100%, 100%;
    border-radius: 50%;
    border: 1px solid #ccc;
}
*/
/* display 4 */
/*
@media (min-width: 768px) {
	#carouselMulti .carousel-inner .carousel-item-right.active,
	#carouselMulti .carousel-inner .carousel-item-next,
	#carouselMulti .carousel-item-next:not(.carousel-item-start) {
    transform: translateX(25%) !important;
  }

	#carouselMulti .carousel-inner .carousel-item-left.active,
	#carouselMulti .carousel-item-prev:not(.carousel-item-end),
	#carouselMulti .active.carousel-item-start,
	#carouselMulti .carousel-item-prev:not(.carousel-item-end) {
    transform: translateX(-25%) !important;
  }

  #carouselMulti .carousel-item-next.carousel-item-start, .active.carousel-item-end {
    transform: translateX(0) !important;
  }

	#carouselMulti .carousel-inner .carousel-item-prev,
	#carouselMulti .carousel-item-prev:not(.carousel-item-end) {
    transform: translateX(-25%) !important;
  }
}
 */

/* 角丸追加 */
.rounded-lt {
    /* 左上のみ角丸 */
    border-top-left-radius: .25rem;
    -webkit-border-top-left-radius: .25rem;
    -moz-border-radius-topleft: .25rem;
}

.rounded-rt {
    /* 右上のみ角丸 */
    border-top-right-radius: 6px;
    -webkit-border-top-right-radius: 6px;
    -moz-border-radius-topright: 6px;
}

.rounded-lb {
    /* 左下のみ角丸 */
    border-bottom-left-radius: 6px;
    -webkit-border-bottom-left-radius: 6px;
    -moz-border-radius-bottomleft: 6px;
}

.rounded-rb {
    /* 右下のみ角丸 */
    border-bottom-right-radius: 6px;
    -webkit-border-bottom-right-radius: 6px;
    -moz-border-radius-bottomright: 6px;
}

.hr-pink {
    height: 1px;
    background-color: #ed1459;
    border: none;
    color: #ed1459 !important
}

.hr-blue {
    height: 1px;
    background-color: #00b4cd;
    border: none;
    color: #00b4cd !important
}

.hr-3 {
    border: solid 1px #aaa;
}

/* Adding similar class as Bootstrap */
.fs-1 {
    font-size: 70% !important
}

.fs-1h {
    font-size: 80% !important
}

.fs-2 {
    font-size: 85% !important
}

.fs-3 {
    font-size: 100% !important
}

.fs-4 {
    font-size: 120% !important
}

.fs-5 {
    font-size: 150% !important
}

.fs-h5 {
    font-size: 1.25rem;
}

.mt-01,
.my-01 {
    margin-top: .1rem !important
}

.mb-01,
.my-01 {
    margin-bottom: .1rem !important
}

.mr-01,
.mx-01 {
    margin-right: .1rem !important
}

.ml-01,
.mx-01 {
    margin-left: .1rem !important
}

.mt-n01,
.my-n01 {
    margin-top: -.1rem !important
}

.mb-n01,
.my-n01 {
    margin-bottom: -.1rem !important
}

.mr-n01,
.mx-n01 {
    margin-right: -.1rem !important
}

.ml-n01,
.mx-n01 {
    margin-left: -.1rem !important
}

.pt-01,
.py-01 {
    padding-top: .1rem !important
}

.pb-01,
.py-01 {
    padding-bottom: .1rem !important
}

.pr-01,
.px-01 {
    padding-right: .1rem !important
}

.pl-01,
.px-01 {
    padding-left: .1rem !important
}

.pb-10 {
    padding-bottom: 10rem !important
}

.pt-n01,
.py-n01 {
    padding-top: -.1rem !important
}

.pb-n01,
.py-n01 {
    padding-bottom: -.1rem !important
}

.pr-n01,
.px-n01 {
    padding-right: -.1rem !important
}

.pl-n01,
.px-n01 {
    padding-left: -.1rem !important
}

.mt-n1,
.my-n1 {
    margin-top: -.25rem !important
}

.mt-n2,
.my-n2 {
    margin-top: -.5rem !important
}

.mt-n3,
.my-n3 {
    margin-top: -1rem !important
}

.mt-n4,
.my-n4 {
    margin-top: -1.5rem !important
}

.mt-n5,
.my-n5 {
    margin-top: -3rem !important
}

.mb-n1,
.my-n1 {
    margin-bottom: -.25rem !important
}

.mb-n2,
.my-n2 {
    margin-bottom: -.5rem !important
}

.mb-n3,
.my-n3 {
    margin-bottom: -1rem !important
}

.mb-n4,
.my-n4 {
    margin-bottom: -1.5rem !important
}

.mb-n5,
.my-n5 {
    margin-bottom: -3rem !important
}

.mr-n1,
.mx-n1 {
    margin-right: -.25rem !important
}

.mr-n2,
.mx-n2 {
    margin-right: -.5rem !important
}

.mr-n3,
.mx-n3 {
    margin-right: -1rem !important
}

.mr-n4,
.mx-n4 {
    margin-right: -1.5rem !important
}

.mr-n5,
.mx-n5 {
    margin-right: -3rem !important
}

.ml-n1,
.mx-n1 {
    margin-left: -.25rem !important
}

.ml-n2,
.mx-n2 {
    margin-left: -.5rem !important
}

.ml-n3,
.mx-n3 {
    margin-left: -1rem !important
}

.ml-n4,
.mx-n4 {
    margin-left: -1.5rem !important
}

.ml-n5,
.mx-n5 {
    margin-left: -3rem !important
}

.mt-6,
.my-6 {
    margin-top: 3.5rem !important;
}

.mt-7,
.my-7 {
    margin-top: 4rem !important;
}

.mt-10,
.my-10 {
    margin-top: 6rem !important;
}

.mb-6,
.my-6 {
    margin-bottom: 3.5rem !important;
}

.mb-7,
.my-7 {
    margin-bottom: 4rem !important;
}

.pt-6,
.py-6 {
    padding-top: 3.5rem !important;
}

.pt-7,
.py-7 {
    padding-top: 4rem !important;
}

.pb-6,
.py-6 {
    padding-bottom: 3.5rem !important;
}

.pb-7,
.py-7 {
    padding-bottom: 4rem !important;
}

.pr-6,
.px-6 {
    padding-right: 3.5rem !important;
}

.pr-7,
.px-7 {
    padding-right: 4rem !important;
}

.pl-6,
.px-6 {
    padding-left: 3.5rem !important;
}

.pl-7,
.px-7 {
    padding-left: 4rem !important;
}

.pr-8,
.px-8 {
    padding-right: 5rem !important;
}

.pr-9,
.px-9 {
    padding-right: 5.5rem !important;
}

.pl-8,
.px-8 {
    padding-left: 5rem !important;
}

.pl-9,
.px-9 {
    padding-left: 5.5rem !important;
}

.pr-10,
.px-10 {
    padding-right: 6rem !important;
}

.pr-11,
.px-11 {
    padding-right: 6.5rem !important;
}

.pl-10,
.px-10 {
    padding-left: 6rem !important;
}

.pl-11,
.px-11 {
    padding-left: 6.5rem !important;
}



.pt-4h,
.py-4h {
    padding-top: 2rem !important
}

.lh-0 {
    line-height: 1em;
}

.lh-1 {
    line-height: 1.2em;
}

.lh-2 {
    line-height: 1.3em;
}

.lh-3 {
    line-height: 1.4em;
}

.lh-4 {
    line-height: 1.5em;
}

.lh-5 {
    line-height: 1.7em;
}

.lh-6 {
    line-height: 1.9em;
}

.lh-7 {
    line-height: 2.1em;
}

.lh-8 {
    line-height: 3em;
}

.lh-10 {
    line-height: 4em;
}

.bg-lgray {
    background-color: #f2f2f2 !important
}

.bg-lpink {
    background-color: #f7f1f3 !important
}

.bg-yellow {
    background-color: #fff799 !important
}

.bg-pink {
    background-color: #ed1459 !important
}

.bg-blue {
    background-color: #01013f !important
}

.bg-white7 {
    background-color: #fff;
    opacity: 0.7 !important
}

.bg-white8 {
    background-color: #fff;
    opacity: 0.8 !important
}

.bg-white9 {
    background-color: #fff;
    opacity: 0.9 !important
}

.bg-com-info {
    background: url(../images/com_info_bg.png) center no-repeat;
    background-size: cover;
}

.btn-pink {
    color: #fff;
    background-color: #ed1459;
    border-color: #ed1459;
}

.btn-pink:hover {
    color: #fff;
    background-color: #5a6268;
    border-color: #545b62;
}

.btn-pink:focus,
.btn-secondary.focus {
    color: #fff;
    background-color: #5a6268;
    border-color: #545b62;
    box-shadow: 0 0 0 0.2rem rgba(130, 138, 145, 0.5);
}

.z-index1 {
    z-index: 1;
}

.z-index2 {
    z-index: 2;
}

.z-index3 {
    z-index: 3;
}

.z-index4 {
    z-index: 4;
}

.z-index5 {
    z-index: 5;
}

.text-mincho {
    font-family: "游明朝", YuMincho, "ヒラギノ明朝 ProN W3", "Hiragino Mincho ProN", "HG明朝E", "ＭＳ Ｐ明朝", "ＭＳ 明朝", serif !important
}

.text-black {
    color: #000 !important
}

.text-white {
    color: #fff !important
}

.text-pink {
    color: #ed1459 !important
}

.text-red {
    color: #ff0000 !important
}

.text-blue {
    color: #00b4cd !important
}

.text-navy {
    color: #000080 !important
}

.clarendon-text-pro {
    font-family: clarendon-text-pro, serif;
    font-weight: 400;
    font-style: normal;
}

table.weare span.icon:before {
    content: url(../images/icon_list01.png);
    margin: 0 10px 0 -30px;
    position: relative;
    top: 8px;
}


.ls-1px {
    letter-spacing: 1px
}

.ls-1 {
    letter-spacing: 0.1rem
}

.ls-2 {
    letter-spacing: 0.2rem
}

.ls-3 {
    letter-spacing: 0.3rem
}

.ls-4 {
    letter-spacing: 0.4rem
}

.border-pink {
    border: solid 1px #ed1459 !important
}

.border-pink-top {
    border-top: solid 1px #ed1459 !important
}

.border-pink-bottom {
    border-bottom: solid 1px #ed1459 !important
}

.border-pink-left {
    border-left: solid 1px #ed1459 !important
}

.border-pink-right {
    border-right: solid 1px #ed1459 !important
}



.bb-white {
    border-bottom: solid #fff 1px;
}

.bb-blue {
    border-bottom: solid #01013f 1px
}

.bb-dark {
    border-bottom: solid #95999c 1px
}

.h-100 {
    height: 100%;
}

/* NAVI */
.navbar-nav .nav-item.active .nav-link,
.navbar-nav .nav-item:hover .nav-link {
    color: #ed1459;
}

.navbar-nav li {
    font-weight: bold;
}

@media (min-width: 992px) {
    .navbar-nav li {
        font-size: 70%;
    }
}

@media (min-width: 1200px) {
    .navbar {
        padding: 0;
    }

    .navbar-nav li {
        font-size: 90%;
    }
}

/* Original Class */
p.inquiry {
    font-size: 18px;
    color: #ed1459;
}

.valign-subtitle {
    height: 6rem;
    padding-top: 10px;
    display: table;
    width: 100%;
}

/* 疑似Valign */
.valign-outer5 {
    height: 5rem;
    display: table;
    width: 100%;
}

.valign-outer-fkd {
    height: 5.6rem;
    display: table;
    width: 25%;
}

.valign-outer-rslt {
    height: 7.9rem;
    display: table;
    width: 100%;
}

.valign-inner {
    display: table-cell;
    vertical-align: middle;
}

.mail:before {
    font-family: "Font Awesome 5 Free";
    content: '\f0e0';
    font-weight: 400;
    font-size: 150%;
    color: #fff;
}

/*
    width: 50px;
    height: 50px;
    color: #ffffff;
    background-color: #2779bd;
*/
.pic-outer {
    position: relative;
}

.zoom {
    width: 30px;
    height: 30px;
    color: #ffffff;
    background-color: rgba(237, 20, 89, 0.3);
    display: flex;
    justify-content: center;
    align-items: center;
    font-size: 1rem;
    border-radius: 50%;
    cursor: pointer;
    position: absolute;
    top: 33px;
    right: 11px;
}

.based {
    z-index: 1;
    position: relative;
    width: 100%;
    min-height: 400px;
    margin-top: 0rem !important
}

@media (min-width: 768px) {
    .based {
        margin-top: -1rem !important
    }
}

.inner {
    z-index: 2;
    position: absolute;
    padding: 0 30px 0 30px;
    line-height: 2em;
    font-size: 95%;
    width: 100%;
    top: 190px;
}

@media (min-width: 576px) {
    .inner {
        font-size: 110%;
        top: 200px;
    }
}

@media (min-width: 768px) {
    .inner {
        font-size: 67%;
        top: 110px;
    }
}

@media (min-width: 992px) {
    .inner {
        font-size: 85%;
        top: 150px;
    }
}

@media (min-width: 1200px) {
    .inner {
        font-size: 100%;
        top: 200px;
    }
}


@media (min-width: 768px) {
    .top-intro {
        min-height: 600px;
        background: #dc1d55;
        line-height: 4em;
    }
}

@media (min-width: 768px) and (max-width:992px) {
    .fs-subtitle {
        font-size: 90%;
    }
}

.btn-border {
    display: inline-block;
    max-width: 180px;
    text-align: left;
    border: 2px solid #ed1459;
    background-color: #fff;
    font-size: 16px;
    color: #ed1459;
    text-decoration: none;
    font-weight: bold;
    padding: 8px 16px;
    border-radius: 4px;
    transition: .4s;
}

.btn-border:hover {
    background-color: #ed1459;
    border-color: #f7f1f3;
    color: #FFF;
}

/* 入力フォーム */
button.btn-submit {
    padding: 10px 30px;
    background-color: #ed1459;
    color: #fff;
    font-weight: bold;
    border-style: none;
    border-radius: .25rem !important
}

button.btn-submit:hover {
    background-color: #aa0f42;
    color: #fff;
}

.hide {
    display: none;
}

label.error {
    color: red;
}
