@charset "UTF-8";
@import url('https://fonts.googleapis.com/css2?family=Aboreto&family=Noto+Sans+JP:wght@100..900&display=swap');

/* -----------------------------------------------------------------
   reset
----------------------------------------------------------------- */
:root {
    --red: #FF173F;
    --pink: #FFF3F5;
    --gray: #8E9BA7;
    --link: #0b57d0;
    --title: #3F4A55;
    --tx: #141414;
    --font-family-base: "Noto Sans JP", "Helvetica Neue", Helvetica, "Hiragino Sans", "Hiragino Kaku Gothic ProN", Arial, sans-serif;
}

* {
    font-family: var(--font-family-base);
}

*,
::before,
::after {
    padding: 0px;
    margin: 0px;
    border: 0;
    box-sizing: border-box;
}

html {
    font-size: 62.5%;
    box-sizing: border-box;
    font-optical-sizing: auto;
    font-weight: 400;
    font-style: normal;
    scroll-behavior: smooth;
    line-height: 1.6;
    text-size-adjust: 100%;
    -webkit-tap-highlight-color: transparent;
}

body {
    font-size: 1.6rem;
    font-optical-sizing: auto;
    font-weight: 400;
    font-style: normal;
    line-height: 1.7;
    box-sizing: border-box;
    position: relative;
    text-size-adjust: 100%;
    font-feature-settings: "palt";
    letter-spacing: 0.05em;
    -webkit-font-smoothing: antialiased;
    width: 100%;
    min-width: 320px;
    overflow-x: hidden;
    color: var(--tx);
    z-index: 0;
    background-color: #F3F3F3;
}

input,
textarea {
    margin: 0px;
    padding: 0px;
    background: none;
    border: none;
    outline: none;
    border-radius: 0px;
    font-size: 16px;
    font-family: var(--font-family-base);
}

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

ol,
ul {
    list-style: none;
}

blockquote,
q {
    quotes: none;
}

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

table {
    border-collapse: collapse;
    border-spacing: 0px;
    width: 100%;
}

a {
    text-decoration: none;
    background-color: transparent;
    word-break: break-all;
    transition: all 0.2s ease 0s;
    position: relative;
    color: var(--tx);
}

a.tx-link {
    color: var(--link);
    text-decoration: underline;
}

a.tx-link:hover {
    color: var(--tx);
    text-decoration: none;
}

input[type="text"],
select {
    border-radius: 3px;
    border: none;
    padding: 6px;
    font-size: inheirt;
    box-sizing: border-box;
}

input::placeholder {
    color: #B5B5B5;
    font-size: 15px;
}

pre {
    white-space: pre-wrap;
}

img {
    display: block;
    width: 100%;
    height: auto;
    border-style: none;
}

button {
    font-size: 15px;
    background-color: transparent;
    border: none;
    cursor: pointer;
    outline: none;
    padding: 0px;
    appearance: none;
}

@media (max-width: 599px) {
    body {
        font-size: 1.5rem;
    }
}


/*----------------------
アイコン
-----------------------*/
@font-face {
    font-family: 'ic';
    src:
        url('../fonts/ic.ttf?7knd21') format('truetype'),
        url('../fonts/ic.woff?7knd21') format('woff'),
        url('../fonts/ic.svg?7knd21#ic') format('svg');
    font-weight: normal;
    font-style: normal;
    font-display: block;
}

.ic,
[data-icon] {
    /* use !important to prevent issues with browser extensions that change fonts */
    font-family: 'ic' !important;
    speak: never;
    font-style: normal;
    font-weight: normal;
    font-variant: normal;
    text-transform: none;
    line-height: 1;

    /* Better Font Rendering =========== */
    -webkit-font-smoothing: antialiased;
    -moz-osx-font-smoothing: grayscale;
}

.ic-MinusCircle:before,
[data-icon="0"]:before {
    content: "\e900";
}

.ic-PlusCircle:before,
[data-icon="1"]:before {
    content: "\e901";
}

.ic-ChevronDown:before,
[data-icon="2"]:before {
    content: "\e902";
}

.ic-ChevronUp:before,
[data-icon="3"]:before {
    content: "\e903";
}

.ic-ChevronRight:before,
[data-icon="4"]:before {
    content: "\e904";
}

.ic-ChevronLeft:before,
[data-icon="5"]:before {
    content: "\e905";
}

.ic-Phone:before,
[data-icon="6"]:before {
    content: "\e906";
}

.ic-Plus:before,
[data-icon="7"]:before {
    content: "\e907";
}

.ic-account:before,
[data-icon="8"]:before {
    content: "\e908";
}

.ic-arrow-down:before,
[data-icon="9"]:before {
    content: "\e909";
}

.ic-bell:before,
[data-icon="10"]:before {
    content: "\e90a";
}

.ic-cart:before,
[data-icon="11"]:before {
    content: "\e90b";
}

.ic-check:before,
[data-icon="12"]:before {
    content: "\e90c";
}

.ic-diamond:before,
[data-icon="13"]:before {
    content: "\e90d";
}

.ic-Download:before,
[data-icon="14"]:before {
    content: "\e90e";
}

.ic-email:before,
[data-icon="15"]:before {
    content: "\e90f";
}

.ic-flag:before,
[data-icon="16"]:before {
    content: "\e910";
}

.ic-flash:before,
[data-icon="17"]:before {
    content: "\e911";
}

.ic-flask:before,
[data-icon="18"]:before {
    content: "\e912";
}

.ic-flask-empty:before,
[data-icon="19"]:before {
    content: "\e913";
}

.ic-heart:before,
[data-icon="20"]:before {
    content: "\e914";
}

.ic-home:before,
[data-icon="21"]:before {
    content: "\e915";
}

.ic-lightbulb:before,
[data-icon="22"]:before {
    content: "\e916";
}

.ic-lock:before,
[data-icon="23"]:before {
    content: "\e917";
}

.ic-magnify:before,
[data-icon="24"]:before {
    content: "\e918";
}

.ic-map-marker:before,
[data-icon="25"]:before {
    content: "\e919";
}

.ic-music:before,
[data-icon="26"]:before {
    content: "\e91a";
}

.ic-note-text:before,
[data-icon="27"]:before {
    content: "\e91b";
}

.ic-script:before,
[data-icon="28"]:before {
    content: "\e91c";
}

.ic-share:before,
[data-icon="29"]:before {
    content: "\e91d";
}

.ic-share-variant:before,
[data-icon="30"]:before {
    content: "\e91e";
}

.ic-shield:before,
[data-icon="31"]:before {
    content: "\e91f";
}

.ic-star:before,
[data-icon="32"]:before {
    content: "\e920";
}

.ic-trophy:before,
[data-icon="33"]:before {
    content: "\e921";
}

.ic-arrow_prev:before,
[data-icon="34"]:before {
    content: "\e922";
}

.ic-arrow_next:before,
[data-icon="35"]:before {
    content: "\e923";
}

.ic-LINE_LOGO:before,
[data-icon="36"]:before {
    content: "\e924";
}

.ic-Instagram_logo:before,
[data-icon="37"]:before {
    content: "\e925";
}

.ic-open_new:before,
[data-icon="38"]:before {
    content: "\e926";
}

.ic-clipboardCheck:before,
[data-icon="38"]:before {
    content: "\e927";
}

.ic-Youtube:before,
[data-icon="39"]:before {
    content: "\e928";
}

.ic-RiNotion:before,
[data-icon="40"]:before {
    content: "\e929";
}

.ic-video:before,
[data-icon="41"]:before {
    content: "\e92a";
}


/*----------------------
共通
-----------------------*/
body.no_scroll {
    overflow: hidden;
}

.pc_br {
    display: block;
}

.sp_br {
    display: none;
}

.main {
    padding: 50px;
    max-width: 1025px;
    margin: 0 auto;
}

.tx-large {
    font-size: 1.5em;
}

.tx-small {
    font-size: 0.7em;
}

.tx-l,
[data-txalign="0"] {
    text-align: left;
}

.tx-c,
[data-txalign="1"] {
    text-align: center;
}

.tx-r,
[data-txalign="2"] {
    text-align: right;
}

.tx-red {
    color: var(--red);
}

h1 {
    width: 100%;
    font-size: 18px;
    text-align: center;
    padding: 18px 20px;
    background-color: #fff;
}


/* Smartphone */
@media (max-width: 640px) {
    .pc_br {
        display: none;
    }

    .sp_br {
        display: block;
    }

    .main {
        padding: 30px 20px 80px;
    }

    h1 {
        font-size: 16px;
        padding: 16px 20px;
    }
}

/*----------------------
追従ボタンエリア
-----------------------*/
.fixed-box {
    position: fixed;
    bottom: 10px;
    right: 0;
    width: calc(100% - 10px);
    max-width: 420px;
    background-color: #fff;
    /*    backdrop-filter: blur(10px);*/
    /*    -webkit-backdrop-filter: blur(10px);*/
    border-radius: 5rem 0 0 5rem;
    display: flex;
    gap: 5px;
    padding-left: 10px;
    z-index: 99;
}

.fixed-box a {
    width: 60px;
    min-height: 60px;
    display: flex;
    flex-direction: column;
    justify-content: center;
    align-items: center;
}

.fixed-box a i {
    font-size: 20px;
}

.fixed-box a span {
    font-size: 10px;
    text-align: center;
}

.fixed-box a:hover {
    opacity: 0.7;
}

.user {
    width: calc(100% - 195px);
    position: relative;
    padding-left: 30px;
    display: flex;
    flex-direction: column;
    justify-content: center;
    gap: 2px;
}

.user-type {
	display: inline-block;
	    width: fit-content;
		width: -webkit-fit-content;
	    padding: 1px 2px;
	    border: solid 1px #000;
	    font-size: 8px;
}

.user::before {
    font-size: 20px;
    position: absolute;
    top: 50%;
    left: 0;
    transform: translate(0%, -50%);
}

.user-name {
    display: flex;
    align-items: center;
    gap: 2px;
    font-size: 14px;
}


.user-salon {
    font-size: 11px;
    color: #929292;
}

.to_top {
    color: #fff;
    background-color: #000;
}

.page_back {
    display: block;
    position: absolute;
    top: 15px;
    left: 10px;
    font-size: 33px;
    line-height: 1;
}