
@font-face {
    font-family: "dseg7-classic-mini";
    font-style: normal;
    font-weight: 300;
    src: url("../font/dseg7-classic-mini/DSEG7ClassicMini-Light.woff2");
    font-display: swap;
}
@font-face {
    font-family: "dseg7-classic-mini";
    font-style: normal;
    font-weight: 400;
    src: url("../font/dseg7-classic-mini/DSEG7ClassicMini-Regular.woff2");
    font-display: swap;
}
@font-face {
    font-family: "dseg7-classic-mini";
    font-style: normal;
    font-weight: 500;
    src: url("../font/dseg7-classic-mini/DSEG7ClassicMini-Regular.woff2");
    font-display: swap;
}
@font-face {
    font-family: "dseg7-classic-mini";
    font-style: normal;
    font-weight: 700;
    src: url("../font/dseg7-classic-mini/DSEG7ClassicMini-Bold.woff2");
    font-display: swap;
}
@font-face {
    font-family: "dseg7-classic-mini";
    font-style: normal;
    font-weight: 900;
    src: url("../font/dseg7-classic-mini/DSEG7ClassicMini-Bold.woff2");
    font-display: swap;
}
@font-face {
    font-family: "dseg7-classic-mini";
    font-style: italic;
    src: url("../font/dseg7-classic-mini/DSEG7ClassicMini-Italic.woff2");
    font-display: swap;
}
@font-face {
    font-family: "NotoSansJP-Bold";
    src: url("../../../font/NotoSansJP-Bold.ttf");
}
@font-face {
    font-family: "NotoSansJP-Medium";
    src: url("../../../font/NotoSansJP-Medium.ttf");
}


body {
    font-family: 'Zen Kaku Gothic Antique', sans-serif;
}

.noto-sans-jp-medium {
    font-family: "NotoSansJP-Medium" !important;
    font-optical-sizing: auto !important;
    font-weight: 100 !important;
    font-style: normal !important;
}

.noto-sans-jp-bold {
    font-family: "NotoSansJP-Bold" !important;
    font-optical-sizing: auto !important;
    font-weight: 100 !important;
    font-style: normal !important;
}

.btn-yellow {
    color: #000000;
    background-color: #ffee1d;
    border-color: #ffee1d;
}

a.text-blue {
    color: #62a5e9;
    text-decoration:underline;
}

.text-sm {
    font-size: 1rem !important;
}

.text-md {
    font-size: 1.2rem !important;
}

.text-base {
    font-size: 1.5rem !important;
}

.text-5xl {
    font-size: 3rem !important;
}

.text-20 {
    font-size: 20px !important;
}

.text-26 {
    font-size: 26px !important;
}

.vertical-align-text-bottom {
    vertical-align: text-bottom !important;
}

.font-weight-unset {
    font-weight: unset !important;
}

.font-bold {
    font-weight: 700 !important;
}

.font-w-500 {
    font-weight: 500 !important;
}

.position-unset {
    position: unset !important;
}

.required::after {
    content: '*';
    color: red;
}

.required-text::after {
    content: '必須';
    color: white;
    background-color: #C82333;
    margin-left: 5px;
    padding: 0 5px;
    border-radius: 5px;
    font-size: 10px;
}

.option-text::after {
    content: '任意';
    color: white;
    background-color: #545454;
    margin-left: 5px;
    padding: 0 5px;
    border-radius: 5px;
    font-size: 10px;
}

.btn-warning {
    background-color: #fdfc0e !important;
    border-color: #fdfc0e !important;
}

.btn-warning:hover {
    background-color: #edec0d !important;
    border-color: #edec0d !important;
}

.btn-info {
    color: #474d56;
    background-color: #cfe2f8 !important;
    border-color: #cfe2f8 !important;
}

.btn-info:hover {
    color: #474d56;
    background-color: #bacfe7 !important;
    border-color: #bacfe7 !important;
}

.max-w-full {
    max-width: 100% !important;
}

.form-inline {
    display: -ms-flexbox;
    display: flex;
    -ms-flex-flow: row wrap;
    flex-flow: row wrap;
    -ms-flex-align: center;
    align-items: center;
    flex-wrap: nowrap;
}

.page-item.active .page-link {
    background-color: #85A5B6 !important;
    border-color: #85A5B6 !important;
}

.w-20 {
    width: 5rem !important;
}

.w-40 {
    width: 10rem !important;
}

.w-1\/3 {
    width: 33.333333% !important;
}

.h-20 {
    height: 5rem !important;
}

.h-1 {
    height: 0.25rem !important;
}

.h-0\.5 {
    height: 0.125rem !important;
}

.hover\:underline:hover {
    text-decoration: underline !important;
}

.absolute {
    position: absolute !important;
}

.right-2\/4 {
    right: 50% !important;
}

.right-1\/3 {
    right: 35% !important;
}

.bottom-1\/2 {
    bottom: 50% !important;
}

.datepicker table tr td.today, .datepicker table tr td span.focused {
    background-color: #fde19a !important;
    color: #000 !important;
    background-image: none !important;
}

.height-fit-content {
    height: fit-content;
}

.form-check-input:disabled {
    cursor: not-allowed;
    pointer-events: inherit;
}

.rounded-xl {
    border-radius: 0.75rem !important;
}

.rounded-2xl {
    border-radius: 1rem !important;
}

.p-2\.5 {
    padding: 1rem !important;
}

.bg-orange-gra-cs {
    background: linear-gradient(135deg, #F6D265 0%, #F8A34F 60%) !important;
}

.bg-orange {
    background: #F8A34F !important;
}

.bg-purple {
    background: #8FAADC !important;
}

.text-orange-cs {
    color: #F8A34F !important;
}

.btn-hover-cs:hover {
    opacity: 60% !important;
    color: #F5F3F0;
}

.bg-grey {
    background-color: #F5F3F0;
}

.btn-orange-cs {
    background: #F8A34F !important;
    color: white !important;
}

.btn-white-cs {
    background: #fff;
    box-shadow: var(--ct-card-box-shadow) !important;
}

.btn-outlite-orange-cs {
    background: white !important;
    color: #F8A34F !important;
    border: 1px solid #F8A34F !important;
}

.px-10 {
    padding-left: 10px !important;
    padding-right: 10px !important;
}

.col-form-label {
    padding-top: 0.45rem !important;
    padding-bottom: 0.45rem !important;
}

.icon-right-arrow {
    padding: 1.5px 2px;
}

.icon-right-arrow > i {
    font-size: 0.8rem;
}

.text-underline {
    text-decoration: underline !important;
}

.text-underline-unset {
    text-decoration: unset !important;
}

.button {
    padding: 18px 60px;
    border-radius: 10px;
    background-color: #f8a34f;
    background-image: linear-gradient(90deg, #f6d365, #fda085);
    transition: opacity 200ms ease;
    color: #fff;
    font-size: 16px;
    line-height: 26px;
    font-weight: 700;
    text-align: center;
    text-decoration: none;
    border: 0;
}

.button-white {
    padding: 18px 60px;
    border-radius: 10px;
    background-color: #fff !important;
    transition: opacity 200ms ease;
    color: #6c757d !important;
    font-size: 16px;
    line-height: 26px;
    font-weight: 700;
    text-align: center;
    text-decoration: none;
    border: 0;
}

.button:hover {
    opacity: 0.7;
    color: #fff;
}

.button-white:hover {
    opacity: 0.7;
    color: #dbcccc;
}

.section {
    margin-right: 100px;
    margin-bottom: 140px;
    margin-left: 100px;
    padding-bottom: 140px;
    border-bottom: 1px solid #f8a34f;
}

#footer-area {
    grid-auto-columns: 1fr;
    grid-column-gap: 5px;
    grid-row-gap: 5px;
    grid-template-columns: 1fr 1fr;
    grid-template-rows: auto auto;
}

#footer-part-1 {
    grid-column-start: span 2;
    grid-column-end: span 2;
    grid-row-start: span 1;
    grid-row-end: span 1;
}

#footer-part-3 {
    grid-column-start: span 1;
    grid-column-end: span 1;
    grid-row-start: span 1;
    grid-row-end: span 1;
    justify-self: end;
    grid-column-gap: 20px;
}

.background-image-unset {
    background-image: unset !important;
}

.mt-1\.5 {
    margin-top: 5px !important;
}

.mt-10{
    margin-top: 3.5rem !important;
}

.mt-15{
    margin-top: 5.75rem !important;
}

.w-1\/4 {
    width: 25% !important;
}

.truncate-text-cus {
    display: -webkit-box !important;
    -webkit-line-clamp: 2;
    -webkit-box-orient: vertical;
    text-overflow: ellipsis;
}

.line-height-19 {
    line-height: 19px !important;
}

.line-height-1\/2 {
    line-height: 0.5 !important;
}

.vertical-align-middle {
    vertical-align: middle !important;
}

.share-block-area {
    display: flex !important;
    align-items: center !important;
    grid-column-gap: 10px !important;
    grid-row-gap: 10px !important;
}

.share-block-icon {
    display: flex !important;
    align-items: center !important;
    grid-column-gap: 10px !important;
    grid-row-gap: 10px !important;
}

.shadow-none {
    box-shadow: none !important;
}

.pointer-events-none {
    pointer-events: none !important;
}

.bg-danger {
    background-image: linear-gradient(90deg, #f66565, #e93a07) !important;
}

.text-transform-unset {
    text-transform: unset !important;
}

.mb-1\/2 {
    margin-bottom: 0.2rem !important;
}

.px-4 {
    padding-left: 0.3em !important;
    padding-right: 0.3em !important;
}

.position-unset {
    position: unset !important;
}

.cursor-pointer {
    cursor: pointer !important;
}

.bg-grey-500{
    background-color: #efebe7 !important;
}

.border-none-custom{
    border-style: none !important;
}

.header-bg-coffee{
    background-color: #efebe7;
}

.header-bg-anabuki{
    background-color: #FFFFFF;
}

.header-bg-24karat{
    background-color: #d9d8f6;
}

.header-bg-mcom{
    background-color: white;
}

.text-coffee{
    color: #522318;
}

.text-anabuki{
    color: #4C4C4C;
}

.text-mcom{
    color: #333333;
}

.bg-coffee-600{
    background-color: #ded1b4;
}

.bg-24karat-600{
    background-color: #b6b0f5;
}

.bg-mcom{
    background-color: white;
}

.bg-livedo {
    background-color: #fff9ca !important;
}

.bg-coffee-500{
    background-color: #e2d4b5;
}

.bg-coffee-300{
    background-color: #efebe7;
}

.btn-coffee{
    font-weight: 800;
    font-size: 20px;
}

.btn-coffee-2{
    font-weight: 600;
    font-size: 16px;
}

.btn-coffee-4{
    font-weight: 600;
    font-size: 14px;
}

.btn-coffee-3{
    background-color: #522318 !important;
    color: #fff !important;
    font-size: 20px;
    font-weight: 700;
    width: 100%;
}

.btn-coffee-3:before {
    content: "＞";
    float: right;
    padding: 0 0.8em;
    pointer-events: none;
    text-align: center;
    width: 1em;
}

.btn-coffee-no-arrow{
    background-color: #522318 !important;
    color: #fff !important;
    font-size: 20px;
    font-weight: 700;
    width: 100%;
}

.modal-coffee{
    background-color: #e2d4b5;
    border-radius: 15px;
}

.privilege-image-card{
    height: 250px;
    width:250px;
    object-fit: cover;
    border-radius: 15px;
}

.btn-close-coffee{
    margin: 0rem 0rem -1rem auto !important;
    border-radius: 50%;
    background: transparent url("data:image/svg+xml,%3csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 16 16' fill='%23ffffff'%3e%3cpath d='M.293.293a1 1 0 011.414 0L8 6.586 14.293.293a1 1 0 111.414 1.414L9.414 8l6.293 6.293a1 1 0 01-1.414 1.414L8 9.414l-6.293 6.293a1 1 0 01-1.414-1.414L6.586 8 .293 1.707a1 1 0 010-1.414z'/%3e%3c/svg%3e") center/1em auto no-repeat;
    background-color: #522318;
}

.none-box-shadow{
    box-shadow: none !important;
}

.float-unset {
    float: unset !important;
}

.margin-left-unset {
    margin-left: unset !important;
}

.user-drag-none {
    -webkit-user-drag: none !important;
}


.mt-8 {
    margin-top: 3.25rem !important;
}

.display-title-header-mobile {
    display: none !important;
}

.truncate {
    overflow: hidden;
    white-space: nowrap;
    text-overflow: ellipsis;
}

.truncate-2-lines {
  display: -webkit-box;
  -webkit-line-clamp: 2;
  -webkit-box-orient: vertical;
  overflow: hidden;
  text-overflow: ellipsis;
}
