@charset "UTF-8";

/* Fun to Me（PC） */

/* 共通 */
.pane-contents{
    padding-bottom: 0;
}

/* ブランドTOP */
.page-ftm_top .container {
    width: 100%;
    margin: 0;

    font-family: var(--typeHeaderPrimary), var(--typeHeaderFallback);
    letter-spacing: var(--typeHeaderSpacing);
    /* line-height: var(--typeHeaderLineHeight) !important;
    color: var(--colorTextBody) !important; */
}

.page-ftm_top .container .btn,
.page-ftm_top .container .rte .btn{
    line-height: 1.42;
    text-decoration: none;
    text-align: center;
    white-space: normal;
    font-size: 0.96rem !important;
    font-weight: 700;
    /* text-transform: uppercase; */
    letter-spacing: 0.3em;
    display: inline-block;
    padding: 11px 20px;
    margin: 0;
    width: auto;
    min-width: 90px;
    vertical-align: middle;
    cursor: pointer;
    border: 1px solid transparent;
    -webkit-user-select: none;
    user-select: none;
    -webkit-appearance: none;
    -moz-appearance: none;
    border-radius: var(--buttonRadius);
    color: var(--colorBtnPrimaryText);
    background: var(--colorBtnPrimary);
    
    border-radius: 50vh !important;
    letter-spacing: .05em !important;
    padding: 1em 3em 1.2em !important;
    line-height: 1 !important;
    font-weight: 400 !important;
}

.page-ftm_top .container p {
    margin: 0 0 15px 0;
    line-height: var(--typeBaseLineHeight);
    letter-spacing: var(--typeBaseSpacing);
}

#ftm-read-area .theme-block{
    line-height: var(--typeBaseLineHeight);
}

#ftm-read-area .theme-block .rte{
    visibility: hidden;
}

#ftm-movie-area .theme-block .movie_brightcove{
    margin: 0 auto;
    border: 4px solid #000;
}

#ftm-movie-area .theme-block .movie_brightcove iframe{
    border: none;
}

#ftm-faq-area{
    padding-bottom: 40px;
}

.ftm_instagram ul{
    display: flex;
    flex-wrap: wrap;
    justify-content: center;
    gap: 6px;
}

.ftm_instagram ul li{
    width: 32.6%;
}

.ftm_instagram ul li img {
    width: 180px;
    height: 180px;
    object-fit: cover;
}

/* バランスチェック */
.page-ftm_balancecheck .container {
    width: 100%;
    margin: 0;
}

.page-ftm_balancecheck .container #balance-check{
    width: 1200px;
    margin: 40px auto;
}

/* ブランドメニュー */
.ftm-menu{
    background: #888888;
    color: #FFF;
    padding: 1.2em 0;
    font-family: 'Zen Kaku Gothic Antique', sans-serif;
    letter-spacing: 0.055rem;
}

.ftm-menu .ftm-menu-inner{
    display: flex;
    max-width: 1200px;
    margin: 0 auto;
}

.ftm-logo{
    display: flex;
    justify-content: center;
    align-items: center;
    width: 23%;
}

.ftm-logo img{
    width: 50px;
}

.ftm-logo .ftm-logo-text{
    font-size: 20px;
    line-height: normal !important;
    margin: 0 0 0 0.8rem !important;
    color: #FFF;
    letter-spacing: 0.075em;
}

.ftm-logo .ftm-logo-text span{
    display: block;
    font-size: 14px
}

.ftm-menu-area{
    display: flex;
    align-items: center;
}

.ftm-menu-area .ftm-menu-area-title{
    display:none;
}

.ftm-menu-area .ftm-menu-list{
    display: flex;
}

.ftm-menu-area .ftm-menu-list .ftm-menu-list-item{
    position: relative;
}

.ftm-menu-area .ftm-menu-list .ftm-menu-list-item a{
    color: #FFF;
    font-size: 0.93rem;
    padding: 7.5px 15px;
}

.ftm-menu-area .ftm-menu-list .ftm-menu-list-item a:after{
    content: "";
    display: block;
    position: absolute;
    bottom: 0;
    left: 0;
    right: 100%;
    margin: 0 15px;
    border-bottom: 2px solid;
    border-bottom-color: #ffffff;
    transition: right 0.5s;
}

.ftm-menu-area .ftm-menu-list .ftm-menu-list-item a:hover:after{
    right: 0;
}

/* ブランドフッター */
.ftm-footer{
    background: #888888;
    font-family: 'Zen Kaku Gothic Antique', sans-serif;
    color: #FFF;
    padding: 20px 0;
    letter-spacing: 0.055rem;
}

.ftm-footer .ftm-footer-inner{
    display: flex;
    max-width: 1200px;
    margin: 0 auto;
    justify-content: space-between;
    align-items: center;
}

.ftm-footer .ftm-footer-area a{
    color: #FFF;
}

.ftm-footer .ftm-footer-area .social-icons{
    display: flex;
    gap: 15px;
}

ul.no-bullets.social-icons .icon {
    width: 30px;
    height: 30px;
}

ul.no-bullets.social-icons .icon-line {
    width: 30px;
    height: 30px;
}

.icon path{
    display: inline-block;
    vertical-align: middle;
}

.icon path{
    fill: #FFF !important;
}

.icon__fallback-text {
    border: 0;
    clip: rect(0 0 0 0);
    height: 1px;
    margin: -1px;
    overflow: hidden;
    padding: 0;
    position: absolute;
    width: 1px;
}