/* カスタマイズ用CSS */

/* ================================================ */
/*   共通   　　　                                   */
/* ================================================ */
.border_bottom {
    border-bottom: solid;
    border-width: thin;
}
.border_color_brown {
    border-color: #806142;
}
.font_white {
    color: #fff
}
.font_brown {
    color: #806142;
}
.font_size_3em {
    font-size: 3em;
}
.font_size_2em {
    font-size: 2em;
}
.font_size_1_5em {
    font-size: 1.5em;
}
.font_size_1em {
    font-size: 1em;
}

/* ================================================ */
/*   top画面　　　                                   */
/* ================================================ */
/* 画像スライダー */
@media only screen and (max-width: 746px) {
    .ec-sliderRole img {
        height: 300px;
        object-fit: cover;
        object-position: 95% 50%;
    }
}


.ec-role_gray
{
    background-color: rgba(245,242,240,1);
}

/* App説明 & brandstory- eyecatchをもとに作成 */
.ec-appAboutRole {
}
.ec-brandstoryRole {
}

.ec-scrapbook__grid {
    display: grid;
    padding: 20px 0px 20px;
}
.ec-scrapbook__grid-padding {
    padding-left: 40px;
    padding-right: 40px;
}
@media only screen and (max-width: 767px) {
    .ec-scrapbook__grid {
        display: block;
    }
    .ec-scrapbook__grid-padding {
        padding-left: 20px;
        padding-right: 20px;
    }
}
.ec-scrapbook__grid-2-1 {
	grid-template-columns: 60% 40%;
}
.ec-scrapbook__grid-1-2 {
	grid-template-columns: 40% 60%;
}
.ec-scrapbook__grid-c1 {
	grid-row: 1;
	grid-column: 1;
}
.ec-scrapbook__grid-c2 {
	grid-row: 1;
	grid-column: 2;
}
.ec-scrapbook__image {
    display: block;
    margin: auto;
    height: 100%;
}
.ec-scrapbook__image > img {
    width: 100%;
    height: 100%;
    object-fit: cover;
}
.ec-scrapbook__intro {
    color: black; 
}
@media only screen and (min-width: 768px) {
    .ec-scrapbook__intro.ec-scrapbook__grid-c1 {
        margin: 0px 20px 0px 0px;
    }
    .ec-scrapbook__intro.ec-scrapbook__grid-c2 {
        margin: 0px 0px 0px 20px;
    }
}
.ec-scrapbook__intro > img {
    width: 150px;
    margin: 0px 0px 5px;
}
@media only screen and (max-width: 767px) {
    .ec-scrapbook__intro > img {
        margin: 20px 0px 5px;
    }
}
.ec-scrapbook__introEnTitle {
    margin-bottom: .8em;
    font-size: 16px;
    font-weight: normal; 
}
.ec-scrapbook__introTitleBox {
    padding-top: 1em;
    padding-bottom: .8em;
    margin-bottom: .8em;
}
.ec-scrapbook__introTitle {
    margin-bottom: .8em;
    font-size: 1.2em;
    font-weight: bold; 
    font-family: serif;
    white-space: nowrap;
}
.ec-scrapbook__introDescription {
    margin-bottom: .8em;
    font-size: 1.0em;
    line-height: 1.5em; 
}
@media only screen and (min-width: 768px) {
    .ec-scrapbook__intro .ec-blockBtn--cancel {
        max-width: 260px;
    }
}

/* ボタン */
.ec-blockBtn--top {
    color: #fff;
    background-color: #DDD5CC;
    border-color: #DDD5CC;
}
.ec-blockBtn--top:hover, .ec-blockBtn--top:focus, .ec-blockBtn--top.focus {
    color: #fff;
}
.ec-blockBtn--top:focus, .ec-blockBtn--top.focus {
    color: #fff;
    background-color: #DDD5CC;
    border-color: #DDD5CC;
}
.ec-blockBtn--top:hover {
    color: #fff;
    background-color: #DDD5CC;
    border-color: #DDD5CC;
}
.ec-blockBtn--top:active, .ec-blockBtn--top.active,
.open > .ec-blockBtn--top.dropdown-toggle {
    color: #fff;
    background-color: #DDD5CC;
    border-color: #DDD5CC;
}
.ec-blockBtn--top:active:hover, .ec-blockBtn--top:active:focus, .ec-blockBtn--top:active.focus, .ec-blockBtn--top.active:hover, .ec-blockBtn--top.active:focus, .ec-blockBtn--top.active.focus,
    .open > .ec-blockBtn--top.dropdown-toggle:hover,
    .open > .ec-blockBtn--top.dropdown-toggle:focus,
    .open > .ec-blockBtn--top.dropdown-toggle.focus {
    color: #fff;
    background-color: #DDD5CC;
    border-color: #DDD5CC;
}
.ec-blockBtn--top.disabled:hover, .ec-blockBtn--top.disabled:focus, .ec-blockBtn--top.disabled.focus, .ec-blockBtn--top[disabled]:hover, .ec-blockBtn--top[disabled]:focus, .ec-blockBtn--top[disabled].focus,
fieldset[disabled] .ec-blockBtn--top:hover,
fieldset[disabled] .ec-blockBtn--top:focus,
fieldset[disabled] .ec-blockBtn--top.focus {
    background-color: #DDD5CC;
    border-color: #DDD5CC;
}
.ec-blockBtn--top .badge {
    color: #fff;
    background-color: #DDD5CC;
}


.ec-inlineBtn--top {
    color: #fff;
    background-color: #DDD5CC;
    border-color: #DDD5CC;
}
.ec-inlineBtn--top:hover, .ec-inlineBtn--top:focus, .ec-inlineBtn--top.focus {
    color: #fff;
}
.ec-inlineBtn--top:focus, .ec-inlineBtn--top.focus {
    color: #fff;
    background-color: #DDD5CC;
    border-color: #DDD5CC;
}
.ec-inlineBtn--top:hover {
    color: #fff;
    background-color: #DDD5CC;
    border-color: #DDD5CC;
}
.ec-inlineBtn--top:active, .ec-inlineBtn--top.active,
.open > .ec-inlineBtn--top.dropdown-toggle {
    color: #fff;
    background-color: #DDD5CC;
    border-color: #DDD5CC;
}
.ec-inlineBtn--top:active:hover, .ec-inlineBtn--top:active:focus, .ec-inlineBtn--top:active.focus, .ec-inlineBtn--top.active:hover, .ec-inlineBtn--top.active:focus, .ec-inlineBtn--top.active.focus,
    .open > .ec-inlineBtn--top.dropdown-toggle:hover,
    .open > .ec-inlineBtn--top.dropdown-toggle:focus,
    .open > .ec-inlineBtn--top.dropdown-toggle.focus {
    color: #fff;
    background-color: #DDD5CC;
    border-color: #DDD5CC;
}
.ec-inlineBtn--top.disabled:hover, .ec-inlineBtn--top.disabled:focus, .ec-inlineBtn--top.disabled.focus, .ec-inlineBtn--top[disabled]:hover, .ec-inlineBtn--top[disabled]:focus, .ec-inlineBtn--top[disabled].focus,
fieldset[disabled] .ec-inlineBtn--top:hover,
fieldset[disabled] .ec-inlineBtn--top:focus,
fieldset[disabled] .ec-inlineBtn--top.focus {
    background-color: #DDD5CC;
    border-color: #DDD5CC;
}
.ec-inlineBtn--top .badge {
    color: #fff;
    background-color: #DDD5CC;
}


/* ================================================ */
/*   actionボタン                                   */
/* ================================================ */
.ec-blockBtn--primary {
    color: #fff;
    background-color: #CAAE00;
    border-color: #CAAE00;
}
.ec-blockBtn--primary:hover, .ec-blockBtn--primary:focus, .ec-blockBtn--primary.focus {
    color: #fff;
}
.ec-blockBtn--primary:focus, .ec-blockBtn--primary.focus {
    color: #fff;
    background-color: #978200;
    border-color: #978200;
}
.ec-blockBtn--primary:hover {
    color: #fff;
    background-color: #978200;
    border-color: #978200;
}
.ec-blockBtn--primary:active, .ec-blockBtn--primary.active,
.open > .ec-blockBtn--primary.dropdown-toggle {
    color: #fff;
    background-color: #978200;
    border-color: #978200;
}
.ec-blockBtn--primary:active:hover, .ec-blockBtn--primary:active:focus, .ec-blockBtn--primary:active.focus, .ec-blockBtn--primary.active:hover, .ec-blockBtn--primary.active:focus, .ec-blockBtn--primary.active.focus,
    .open > .ec-blockBtn--primary.dropdown-toggle:hover,
    .open > .ec-blockBtn--primary.dropdown-toggle:focus,
    .open > .ec-blockBtn--primary.dropdown-toggle.focus {
    color: #fff;
    background-color: #978200;
    border-color: #978200;
}
.ec-blockBtn--primary.disabled:hover, .ec-blockBtn--primary.disabled:focus, .ec-blockBtn--primary.disabled.focus, .ec-blockBtn--primary[disabled]:hover, .ec-blockBtn--primary[disabled]:focus, .ec-blockBtn--primary[disabled].focus,
fieldset[disabled] .ec-blockBtn--primary:hover,
fieldset[disabled] .ec-blockBtn--primary:focus,
fieldset[disabled] .ec-blockBtn--primary.focus {
    background-color: #CAAE00;
    border-color: #CAAE00;
}
.ec-blockBtn--primary .badge {
    color: #fff;
    background-color: #CAAE00;
}

.ec-inlineBtn--primary {
    color: #fff;
    background-color: #CAAE00;
    border-color: #CAAE00;
}
.ec-inlineBtn--primary:hover, .ec-inlineBtn--primary:focus, .ec-inlineBtn--primary.focus {
    color: #fff;
}
.ec-inlineBtn--primary:focus, .ec-inlineBtn--primary.focus {
    color: #fff;
    background-color: #978200;
    border-color: #978200;
}
.ec-inlineBtn--primary:hover {
    color: #fff;
    background-color: #978200;
    border-color: #978200;
}
.ec-inlineBtn--primary:active, .ec-inlineBtn--primary.active,
.open > .ec-inlineBtn--primary.dropdown-toggle {
    color: #fff;
    background-color: #978200;
    border-color: #978200;
}
.ec-inlineBtn--primary:active:hover, .ec-inlineBtn--primary:active:focus, .ec-inlineBtn--primary:active.focus, .ec-inlineBtn--primary.active:hover, .ec-inlineBtn--primary.active:focus, .ec-inlineBtn--primary.active.focus,
    .open > .ec-inlineBtn--primary.dropdown-toggle:hover,
    .open > .ec-inlineBtn--primary.dropdown-toggle:focus,
    .open > .ec-inlineBtn--primary.dropdown-toggle.focus {
    color: #fff;
    background-color: #978200;
    border-color: #978200;
}
.ec-inlineBtn--primary.disabled:hover, .ec-inlineBtn--primary.disabled:focus, .ec-inlineBtn--primary.disabled.focus, .ec-inlineBtn--primary[disabled]:hover, .ec-inlineBtn--primary[disabled]:focus, .ec-inlineBtn--primary[disabled].focus,
fieldset[disabled] .ec-inlineBtn--primary:hover,
fieldset[disabled] .ec-inlineBtn--primary:focus,
fieldset[disabled] .ec-inlineBtn--primary.focus {
    background-color: #CAAE00;
    border-color: #CAAE00;
}
.ec-inlineBtn--primary .badge {
    color: #fff;
    background-color: #CAAE00;
}

/* ================================================ */
/*   actionボタン                                   */
/* ================================================ */
.ec-blockBtn--action {
    color: #fff;
    background-color: #DDD5CC;
    border-color: #DDD5CC;
}
.ec-blockBtn--action:hover, .ec-blockBtn--action:focus, .ec-blockBtn--action.focus {
    color: #fff;
}
.ec-blockBtn--action:focus, .ec-blockBtn--action.focus {
    color: #fff;
    background-color: #a6a099;
    border-color: #a6a099;
}
.ec-blockBtn--action:hover {
    color: #fff;
    background-color: #a6a099;
    border-color: #a6a099; 
}
.ec-blockBtn--action:active, .ec-blockBtn--action.active,
.open > .ec-blockBtn--action.dropdown-toggle {
    color: #fff;
    background-color: #a6a099;
    border-color: #a6a099; 
}
.ec-blockBtn--action:active:hover, .ec-blockBtn--action:active:focus, .ec-blockBtn--action:active.focus, .ec-blockBtn--action.active:hover, .ec-blockBtn--action.active:focus, .ec-blockBtn--action.active.focus,
    .open > .ec-blockBtn--action.dropdown-toggle:hover,
    .open > .ec-blockBtn--action.dropdown-toggle:focus,
    .open > .ec-blockBtn--action.dropdown-toggle.focus {
    color: #fff;
    background-color: #a6a099;
    border-color: #a6a099; 
}
.ec-blockBtn--action.disabled:hover, .ec-blockBtn--action.disabled:focus, .ec-blockBtn--action.disabled.focus, .ec-blockBtn--action[disabled]:hover, .ec-blockBtn--action[disabled]:focus, .ec-blockBtn--action[disabled].focus,
fieldset[disabled] .ec-blockBtn--action:hover,
fieldset[disabled] .ec-blockBtn--action:focus,
fieldset[disabled] .ec-blockBtn--action.focus {
    background-color: #DDD5CC;
    border-color: #DDD5CC; 
}
.ec-blockBtn--action .badge {
    color: #fff;
    background-color: #DDD5CC; 
}


.ec-inlineBtn--action {
    color: #fff;
    background-color: #DDD5CC;
    border-color: #DDD5CC; 
}
.ec-inlineBtn--action:hover, .ec-inlineBtn--action:focus, .ec-inlineBtn--action.focus {
    color: #fff;
    text-decoration: none;
}
.ec-inlineBtn--action:focus, .ec-inlineBtn--action.focus {
    color: #fff;
    background-color: #a6a099;
    border-color: #a6a099;
}
.ec-inlineBtn--action:hover {
    color: #fff;
    background-color: #a6a099;
    border-color: #a6a099;
}
.ec-inlineBtn--action:active, .ec-inlineBtn--action.active,
.open > .ec-inlineBtn--action.dropdown-toggle {
    color: #fff;
    background-color: #a6a099;
    border-color: #a6a099;
}
.ec-inlineBtn--action:active:hover, .ec-inlineBtn--action:active:focus, .ec-inlineBtn--action:active.focus, .ec-inlineBtn--action.active:hover, .ec-inlineBtn--action.active:focus, .ec-inlineBtn--action.active.focus,
    .open > .ec-inlineBtn--action.dropdown-toggle:hover,
    .open > .ec-inlineBtn--action.dropdown-toggle:focus,
    .open > .ec-inlineBtn--action.dropdown-toggle.focus {
    color: #fff;
    background-color: #a6a099;
    border-color: #a6a099;
}
.ec-inlineBtn--action.disabled:hover, .ec-inlineBtn--action.disabled:focus, .ec-inlineBtn--action.disabled.focus, .ec-inlineBtn--action[disabled]:hover, .ec-inlineBtn--action[disabled]:focus, .ec-inlineBtn--action[disabled].focus,
fieldset[disabled] .ec-inlineBtn--action:hover,
fieldset[disabled] .ec-inlineBtn--action:focus,
fieldset[disabled] .ec-inlineBtn--action.focus {
    background-color: #DDD5CC;
    border-color: #DDD5CC;
}
.ec-inlineBtn--action .badge {
    color: #fff;
    background-color: #DDD5CC;
}




/* ================================================ */
/*   cancelボタン                                   */
/* ================================================ */
.ec-blockBtn--cancel {
    color: #fff;
    background-color: #7A6A56;
    border-color: #7A6A56;
}
.ec-blockBtn--cancel:hover, .ec-blockBtn--cancel:focus, .ec-blockBtn--cancel.focus {
    color: #fff;
}
.ec-blockBtn--cancel:focus, .ec-blockBtn--cancel.focus {
    color: #fff;
    background-color: #5b4f40;
    border-color: #5b4f40;
}
.ec-blockBtn--cancel:hover {
    color: #fff;
    background-color: #5b4f40;
    border-color: #5b4f40; }
.ec-blockBtn--cancel:active, .ec-blockBtn--cancel.active,
.open > .ec-blockBtn--cancel.dropdown-toggle {
    color: #fff;
    background-color: #5b4f40;
    border-color: #5b4f40;
}
.ec-blockBtn--cancel:active:hover, .ec-blockBtn--cancel:active:focus, .ec-blockBtn--cancel:active.focus, .ec-blockBtn--cancel.active:hover, .ec-blockBtn--cancel.active:focus, .ec-blockBtn--cancel.active.focus,
    .open > .ec-blockBtn--cancel.dropdown-toggle:hover,
    .open > .ec-blockBtn--cancel.dropdown-toggle:focus,
    .open > .ec-blockBtn--cancel.dropdown-toggle.focus {
    color: #fff;
    background-color: #5b4f40;
    border-color: #5b4f40;
}
.ec-blockBtn--cancel.disabled:hover, .ec-blockBtn--cancel.disabled:focus, .ec-blockBtn--cancel.disabled.focus, .ec-blockBtn--cancel[disabled]:hover, .ec-blockBtn--cancel[disabled]:focus, .ec-blockBtn--cancel[disabled].focus,
fieldset[disabled] .ec-blockBtn--cancel:hover,
fieldset[disabled] .ec-blockBtn--cancel:focus,
fieldset[disabled] .ec-blockBtn--cancel.focus {
    background-color: #7A6A56;
    border-color: #7A6A56;
}
.ec-blockBtn--cancel .badge {
    color: #fff;
    background-color: #7A6A56;
}


.ec-inlineBtn--cancel {
    color: #fff;
    background-color: #7A6A56;
    border-color: #7A6A56;
}
.ec-inlineBtn--cancel:hover, .ec-inlineBtn--cancel:focus, .ec-inlineBtn--cancel.focus {
    color: #fff;
}
.ec-inlineBtn--cancel:focus, .ec-inlineBtn--cancel.focus {
    color: #fff;
    background-color: #5b4f40;
    border-color: #5b4f40;
}
.ec-inlineBtn--cancel:hover {
    color: #fff;
    background-color: #5b4f40;
    border-color: #5b4f40;
}
.ec-inlineBtn--cancel:active, .ec-inlineBtn--cancel.active,
.open > .ec-inlineBtn--cancel.dropdown-toggle {
    color: #fff;
    background-color: #5b4f40;
    border-color: #5b4f40;
}
.ec-inlineBtn--cancel:active:hover, .ec-inlineBtn--cancel:active:focus, .ec-inlineBtn--cancel:active.focus, .ec-inlineBtn--cancel.active:hover, .ec-inlineBtn--cancel.active:focus, .ec-inlineBtn--cancel.active.focus,
    .open > .ec-inlineBtn--cancel.dropdown-toggle:hover,
    .open > .ec-inlineBtn--cancel.dropdown-toggle:focus,
    .open > .ec-inlineBtn--cancel.dropdown-toggle.focus {
    color: #fff;
    background-color: #5b4f40;
    border-color: #5b4f40;
}
.ec-inlineBtn--cancel.disabled:hover, .ec-inlineBtn--cancel.disabled:focus, .ec-inlineBtn--cancel.disabled.focus, .ec-inlineBtn--cancel[disabled]:hover, .ec-inlineBtn--cancel[disabled]:focus, .ec-inlineBtn--cancel[disabled].focus,
fieldset[disabled] .ec-inlineBtn--cancel:hover,
fieldset[disabled] .ec-inlineBtn--cancel:focus,
fieldset[disabled] .ec-inlineBtn--cancel.focus {
    background-color: #7A6A56;
    border-color: #7A6A56;
}
.ec-inlineBtn--cancel .badge {
    color: #fff;
    background-color: #7A6A56;
}


/* ================================================ */
/*   ヘッダー                                       */
/* ================================================ */
/* 検索エリア */
.ec-headerSearch .ec-headerSearch__category .ec-select.ec-select_search {
    background: #DDD5CC;
}
.ec-drawerRole {
    background: #DDD5CC;
}
.ec-drawerRoleClose {
    color: #000;
    background: #DDD5CC;
}
.ec-headerSearch .ec-headerSearch__category .ec-select.ec-select_search::before {
    border-top: 6px solid #000;
}
.ec-headerSearch .ec-headerSearch__category .ec-select select {
    color : #000;
}
.ec-drawerRole .ec-headerLinkArea {
    background: #DDD5CC;
}
.ec-drawerRole .ec-headerLinkArea .ec-headerLink__item {
    color: #000;
}
/* カート以外のアイコン */
.ec-headerNavSP {
    color: #000;
    background: #DDD5CC;
}
@media only screen and (min-width: 768px) {
    .ec-headerNav .ec-headerNav__itemLink {
        display: none;
    }
}

.ec-headerNav .ec-headerNav__itemIcon {
    color: #DDD5CC;
}
@media only screen and (max-width: 767px) {
    .ec-headerNaviRole .ec-headerNaviRole__left {
        width: 50px;
    }
    .ec-headerNaviRole .ec-headerNaviRole__right {
        width: calc(100% - 50px);
    }
}
.ec-headerNaviRole__ft {
    padding: 2px 5px;
}
/* カート関連 */
.ec-cartNavi {
    color: #DDD5CC;
}
.ec-cartNavi .ec-cartNavi__badge {
    background-color: #8e8ea1;
}
/* ロゴ */
.ec-headerTitle img {
    width: 75%;
}

/* ================================================ */
/*   フッター                                       */
/* ================================================ */
.ec-footerRole {
	background: #DDD5CC;
}
.ec-footerNavi .ec-footerNavi__link a {
    color: #000;
}
.ec-footerTitle {
    color: #000;
    padding: 20px 0 40px;
}
.ec-footerTitle .ec-footerTitle__logo img {
    width: 25%;
}

/* ================================================ */
/*   顔タイプ診断                                    */
/* ================================================ */
.ec-faceTypeCheckRole {
    margin: 0 auto;
    width: 100%;
}

.ec-faceTypeCheckRole_top {
    text-align: center;
}
.ec-faceTypeCheckRole_topImage {
    max-height: 800px;
    max-width: 100%;
}
.ec-faceTypeCheckRole_about {
    background-color: rgba(195,170,136,0.1);
}
.ec-faceTypeCheckRole_aboutTitle > p {
    font-family: serif;
    font-weight: bold;
    font-size: 23px;
    text-align: center;
    padding: 30px;
}
.ec-faceTypeCheckRole_aboutDescription > p {
    font-size: 16px;
    padding: 0px 30px;
}

.ec-faceTypeCheckRole_aboutImage > img {
    width: 100%;
    margin: 10px 0px 30px;
    padding: 0px 30px;
}

.ec-faceTypeCheckRole_group {
    padding: 20px 0px;
    text-align: center;
}

.ec-faceTypeCheckRole_groupTitle {
    padding: 0px;
}

.ec-faceTypeCheckRole_question {
    padding: 20px 10px;
    margin: 20px 10px 30px;
}

.ec-faceTypeCheckRole_questionTitle {
    padding: 0px;
    font-size: 25px;
    font-weight: bold;
}

.ec-faceTypeCheckRole_question > img {
    width: 90%;
    max-width: 600px;
}

.ec-faceTypeCheckRole_anser {
    margin: auto;
}
.ec-faceTypeCheckRole_anser > fieldset {
    border: 0px solid #c0c0c0;
    margin: 0px;
    padding: 0px;
}

.ec-faceTypeCheckRole_anserInput {
    /* position: absolute; */
    width: 1px;
    height: 1px;
    /* overflow: hidden; */
    border: 0;
    padding: 0;
    margin: 0;
    clip: rect(0, 0, 0, 0);
    clip-path: inset(50%);
    visibility: hidden;
}

.ec-faceTypeCheckRole_anserLabel {
    display: inline-block;
    transition: all .2s;
    background-color: #DDD5CC;
    color: #fff;
    text-shadow: 0 0 1px rgba(0,0,0,.7);
    width: 100%;
    height: 56px;
    line-height: 56px;
    text-align: center;
    margin-bottom: 10px;
    font-size: 18px;
}
.ec-faceTypeCheckRole_anserInput:checked + .ec-faceTypeCheckRole_anserLabel {
    outline-color: rgba(255, 215, 0, 1);
    outline-offset: 0px;
    outline-style: auto;
}

.ec-faceTypeCheckRole_form {
    visibility:hidden;
}

/* ================================================ */
/*   顔タイプ診断結果                                */
/* ================================================ */
.ec-faceTypeResultRole {
    margin: 0 auto;
    width: 100%;
}
.ec-faceTypeResultRole_title {
    text-align: center;
    font-size: large;
}
.ec-faceTypeResultRole_image > img {
    margin: 0 auto;
    display: block;
    max-height: 800px;
    max-width: 100%;
}
.ec-faceType_unknown {
    background-color: #ffffff ;
}
.ec-faceType_cute {
    background-color: #e2b4d1;
}
.ec-faceType_active-cute {
    background-color: #f4f29d;
}
.ec-faceType_feminine {
    background-color: #f0c5bf;
}
.ec-faceType_fresh {
    background-color: #dff1fb;
}
.ec-faceType_soft-elegant {
    background-color: #dacae4;
}
.ec-faceType_elegant {
    background-color: #f498aa;
}
.ec-faceType_cool-casual {
    background-color: #bedeb5;
}
.ec-faceType_cool {
    background-color: #c0b2d6;
}

/* ================================================ */
/*   ブランドストーリー                               */
/* ================================================ */
.ec-bsp_head{
    margin: 0 calc(50% - 50vw);
	width:100vw;
	min-height:200px;
}
.ec-bsp_head > img {
    width: 100%;
    min-height: 200px;
    max-height: 300px;
    object-fit: cover;
    object-position: top;
}
.ec-bsp_contents {
	width:100%;
}
.ec-bsp_section {
    width: 100%;
    padding: 20px;
    text-align: center;
}
.ec-bsp_Intro {
    margin: 0px auto;
}
.ec-bsp_IntroTitleImage {
    max-width: 200px;
}
.ec-bsp_introTitleBox {
    padding-top: 1em;
    padding-bottom: 1em;
}
.ec-bsp_introTitle {
    margin-bottom: .8em;
    font-size: 1.2em;
    font-weight: bold; 
    font-family: serif;
    white-space: nowrap;
}
.ec-bsp_introDescription {
    margin: 20px auto;
    font-size: 1.0em;
    line-height: 1.5em; 
}
@media only screen and (max-width: 600px) {
    .ec-bsp_introDescription {
        text-align: left;
    }
}

.ec-bsp_ImageBox {
    display: block;
    margin: auto;
    padding: 20px 0px;
    max-width: 500px;
}
.ec-bsp_ImageBox > img {
    width: 100%;
    height: 100%;
    object-fit: cover;
}

/* ================================================ */
/*   特商法                                          */
/* ================================================ */
.ec-borderedDefs ul {
    padding-left: 25px;
}
.ec-borderedDefs li > p {
    font-size: 0.9em;
    padding-left: 10px;
}
.ec-input ul {
    padding-left: 25px;
}
.ec-input li {
    margin-bottom: 10px;
}
.ec-input li > p {
    font-size: 0.9em;
    padding-left: 10px;
}