@charset "UTF-8";
/* =====================
  カスタムプロパティ
==================== */
:root{

    /* ==== 色 ==== */
    --white     : #ffffff;
    --black     : #2b2b2b;

    /* ==== デザイン色 ==== */
    --mostblack : #000000;
    --brown     : #c2b28d;
    --purple    : #b983b5;
    --gold      : #f5ca56;
    --salmon    : #ff4150;
    --pink      : #d6304f;
    --navy      : #1a364e;
    --darkBrown : #59391c;
    --sky       : #5c9fe3;
    --skyHover  : #3e84cc;


    --dark     : #343a40;
    --smoke    : #6c757d;
    --darkgrey : #d7d7d7;
    --grey     : #f0f0f0;
    --semismoke: #f6f6f6;
    --sidesmoke: #f3f4f6;
    --red     : #dc3545;
    --orange  : #fe7404;
    --blue    : #0081cc;
    --emerald : #17a2b8;
    --green   : #218838;
    --yellow  : #ffc107;

    /* ==== 枠線 ==== */
    --border  : 1px solid var(--grey ,#eee);
    --radius  : 5px;
    --circle  : 50%;
    --pill    : 50rem;

    /* ==== アニメーション ==== */
    --allAnimation : all 250ms ease 0s;

    /* ==== Easing ==== */
    --easeOutExpo   : cubic-bezier(0.87, 0, 0.13, 1);
    --easeOutQuint  : cubic-bezier(0.22, 1, 0.36, 1);
    --easeInOutBack : cubic-bezier(0.68, -0.6, 0.32, 1.6);


    /* ==== line-height ==== */
    --lhL   : 2;
    --lhL2  : 2.286;
    --lhL4  : 2.143;
    --lh    : 1.857;
    --lhS3  : 1.715;
    --lhS2  : 1.657;
    --lhL1  : 1.571;
    --lhS   : 1.444;

    /* ==== font ==== */
    --icon     : "Material Icons";
    --tenmin   : "ten-mincho", serif;
    --trajan   : "trajan-pro-3", serif;
    --hirakaku : "ヒラギノ角ゴ Pro W3", "Hiragino Kaku Gothic Pro", 'Noto Sans JP', "メイリオ", Meiryo, Osaka, "ＭＳ Ｐゴシック", "MS PGothic", sans-serif;
    --mincho   : "游明朝","Yu Mincho","YuMincho","Hiragino Mincho ProN","Hiragino Mincho Pro","HGS明朝E","メイリオ","Meiryo",serif;
    --gramond  : "EB Garamond", serif;
    --furuta   : "futura-pt", sans-serif;

    /* =====================
      png
    ===================== */
    /* arrow -> */
    --arrow      : url('data:image/svg+xml;charset=utf8,%3Csvg%20xmlns%3D%22http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg%22%20width%3D%2216px%22%20height%3D%225.5px%22%3E%3Cpath%20fill-rule%3D%22evenodd%22%20stroke%3D%22rgb(168%2C%20167%2C%20165)%22%20stroke-width%3D%221px%22%20stroke-linecap%3D%22butt%22%20stroke-linejoin%3D%22miter%22%20fill%3D%22none%22%20d%3D%22M0.500%2C1.999%20L14.500%2C1.999%20%22%2F%3E%3Cpath%20fill-rule%3D%22evenodd%22%20fill%3D%22rgb(103%2C%20103%2C%20103)%22%20d%3D%22M15.509%2C2.508%20L11.502%2C5.009%20L11.502%2C0.008%20L15.509%2C2.508%20Z%22%2F%3E%3C%2Fsvg%3E');
    /* arrow-large < */
    --arrowLarge : url('data:image/svg+xml;charset=utf8,%3Csvg%20xmlns%3D%22http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg%22%20width%3D%2212px%22%20height%3D%2218px%22%3E%3Cpath%20fill-rule%3D%22evenodd%22%20stroke%3D%22rgb(181%2C%20181%2C%20181)%22%20stroke-width%3D%222px%22%20stroke-linecap%3D%22butt%22%20stroke-linejoin%3D%22miter%22%20fill%3D%22none%22%20d%3D%22M9.765%2C3.223%20L4.730%2C8.553%20L9.765%2C13.884%20%22%2F%3E%3C%2Fsvg%3E');
    /* arrow brown >*/
    --arrowBrown : url('data:image/svg+xml;charset=utf8,%3Csvg%20xmlns%3D%22http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg%22%20width%3D%227.5px%22%20height%3D%2212.5px%22%3E%3Cpath%20fill-rule%3D%22evenodd%22%20stroke%3D%22rgb(194%2C%20178%2C%20141)%22%20stroke-width%3D%221px%22%20stroke-linecap%3D%22butt%22%20stroke-linejoin%3D%22miter%22%20fill%3D%22none%22%20d%3D%22M1.405%2C10.803%20L5.178%2C6.403%20L1.405%2C2.002%20%22%2F%3E%3C%2Fsvg%3E');
    /* trianger right path */
    --triangle   : url('data:image/svg+xml;charset=utf8,%3Csvg%20xmlns%3D%22http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg%22%20width%3D%226.5px%22%20height%3D%2210.5px%22%3E%3Cpath%20fill-rule%3D%22evenodd%22%20stroke%3D%22rgb(181%2C%20181%2C%20181)%22%20stroke-width%3D%221px%22%20stroke-linecap%3D%22butt%22%20stroke-linejoin%3D%22miter%22%20fill%3D%22none%22%20d%3D%22M1.341%2C8.022%20L4.200%2C4.624%20L1.341%2C1.226%20%22%2F%3E%3C%2Fsvg%3E');
    /* trianger top path */
    --triangleUP : url('data:image/svg+xml;charset=utf8,%3Csvg%20xmlns%3D%22http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg%22%20width%3D%2218.5px%22%20height%3D%2210.5px%22%3E%3Cpath%20fill-rule%3D%22evenodd%22%20stroke%3D%22rgb(181%2C%20181%2C%20181)%22%20stroke-width%3D%221px%22%20stroke-linecap%3D%22butt%22%20stroke-linejoin%3D%22miter%22%20fill%3D%22none%22%20d%3D%22M15.891%2C9.503%20L8.989%2C2.629%20L2.087%2C9.503%20%22%2F%3E%3C%2Fsvg%3E');
    /* arrow bottom */
    --arrowBottom: url('data:image/svg+xml;charset=utf8,%3Csvg%20xmlns%3D%22http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg%22%20width%3D%229.5px%22%20height%3D%2228px%22%3E%3Cpath%20fill-rule%3D%22evenodd%22%20stroke%3D%22rgb(168%2C%20167%2C%20165)%22%20stroke-width%3D%221px%22%20stroke-linecap%3D%22butt%22%20stroke-linejoin%3D%22miter%22%20fill%3D%22none%22%20d%3D%22M5.001%2C0.499%20L5.001%2C21.499%20%22%2F%3E%3Cpath%20fill-rule%3D%22evenodd%22%20fill%3D%22rgb(103%2C%20103%2C%20103)%22%20d%3D%22M4.507%2C27.491%20L0.005%2C15.504%20L4.522%2C20.943%20L9.007%2C15.504%20L4.507%2C27.491%20Z%22%2F%3E%3C%2Fsvg%3E');

    /* =====================
      png
    ===================== */
    /* select用 */
    --arrowSelect: url('data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAAAwAAAAICAYAAADN5B7xAAAAtklEQVQYlXXQMUuCURSH8d8rLi1uLuIQEbT1OYTARfwCrg01FPcD1C6Eiy0itLQptOXU2hI42hgtTUEUuCQH7guvgs947vM/95xTpJTqOMPcfk7xh1UNj5jhYo9+ggVecBSBJ/xjiMGOfJjlJt7wEYEJLlHgHv0st/CMdu7ewzrmD+7QwA0ecIArHOMVXfyGWAaC2xy6xjTXlvkg36UUI1VJGOfCOzr4qgrVH4JY/hw/GOFz6xUbdE0hd8CNfIEAAAAASUVORK5CYII=');
    /* 虫眼鏡 */
    --searchIcon : url("data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAABgAAAAYCAYAAADgdz34AAAB2klEQVRIia2VMUiVURTH/xqFQYtZmVBNUVBDCFK6SoNCEUEEUjQ4Ca0NtrTl4u5gpOiiQ+TS5uKgiFNFBcGrQUVcjCSliNRf3Mf/q8vn0+/6fAfO975zvv85/3vuvec8AXltA8aBDf7LN2AYuFIBv6/mP76Ikn4CngFPgfnIP1gtwYwThJU223cSaIkwo8a8OijBiAN7c4Df0cr77Xts+3kqwUUHjFUAXAXuA1PGTNs/YftMCsGkwUcLwD3GPbGdVEV4bAOlxD2dduLw/hVYLoqpl8q6oDR5adQFSW8knSuKqvfv8USC95LmJP2QdD4loA5Yl/RH0ulEkkx2JH2QdG0/UKhgSNIpl50q7WFxkgYK8cAJH9y7A3ToimOOpDZanwPGE5K/jppvFqhLHRUDDgpX7y7QEH0LVT4ClozpBjqjmbUnSd7xANiKVhgm6ia7pcn4e0Uke5X20B0ezuWtt+4mcBlYc9JWY+/Y/ljpTFIPNdYwXX/lSG7Z/pwfOdUQZCQ/nfS6fbdtf4lJqiUIejaqJCPJKglz6thhCTKSdSe9YV9XtF0NhyWQb9R3J+2wr912qRYEQcNfa0Zyyb7ybSvf3RpJk6SSpEZJq5JaJHXXqoK4ksV/3Q76Cw6i0EWPZbNuAAAAAElFTkSuQmCC");

    /* 次へ 戻る */
    --arrowNP      : url("data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAAAYAAAAJCAYAAAARml2dAAAAdUlEQVQImW2POw6DQAxEH1nxGo6Qi1CloKPgEtwuV0mRKg2IiDY5ABUNcsRKW8SSP5oZje1KBaiBPYYcF6ABXkBbEimlFMo3cAeewJqJ6AvwOMkJmIkdRY7qpl5L8KZ+1OF30An26lftsjBKo05qW9r+/wM4ALWTEq3CiUAzAAAAAElFTkSuQmCC");
    --arrowNPWhite : url("data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAAAYAAAAJCAYAAAARml2dAAAAXElEQVQImW2PMQqAMAxFn4JTj+BFOjm4OXgJz+ziDfQATg5PClVKaeBDwuMlpFMBBuBJzVc9EIAdiCUgGeqiXuqc5x+kTBmuNUjZ1Fsda+OsjeaNoB5qLNe2/wBeHyN9B6Y7vDUAAAAASUVORK5CYII=");

    /* =====================
      Easing
    ===================== */
    --easeOutExpo   : cubic-bezier(0.87, 0, 0.13, 1);
    --easeOutQuint  : cubic-bezier(0.22, 1, 0.36, 1);
    --easeInOutBack : cubic-bezier(0.68, -0.6, 0.32, 1.6);
}

/* =====================
  リセット要素
==================== */
html{
    font-family: var(--mincho);
    font-weight: 400;
}
html,body{
    color: #2b2b2b;
}

/* =====================
  フォント
==================== */
/* 貂明朝 */
.ff-tenmin{
    font-family: var(--tenmin);
    font-weight: 400;
    font-style: normal;
}
.ff-tenmin.bold{font-weight: 700;}
.ff-tenmin.italic{font-style: italic;}

/* 貂明朝 */
.ff-trajan{
    font-family: var(--trajan);
    font-weight: 400;
    font-style: normal;
}
.ff-trajan.bold{font-weight: 700;}
/* ヒラギノ */
.ff-hirakaku{
    font-family: var(--hirakaku);
    font-weight: normal;
}
.ff-hirakaku.bold{
    font-weight: bold;
}
/* FURUTA */
.ff-furuta{
    font-family: var(--furuta);
    font-weight: 400;
    font-style: normal;
}
.ff-furuta.demi{font-weight: 600;}
.ff-furuta.bold{font-weight: 700;}

/* Garamond */
.ff-garamond{
    font-family: var(--gramond);
}
.ff-garamond.italic{
    font-style: italic;
}

/* =====================
  共通ユーティリティ
==================== */
/* display */
.dn{display: none;}
.dib{display: block;}
.dif{display: inline-flex;}

/* flexbox */
.jc-center{-webkit-justify-content: center;justify-content: center;}
.jc-between{-webkit-justify-content: space-between;justify-content: space-between;}
.ai-center{-webkit-align-items: center;align-items: center;}
.flx{-webkit-flex: 1;-ms-flex: 1;flex: 1;}
[data-flex="center"]{-webkit-align-items: center;align-items: center;-webkit-justify-content: center;justify-content: center;}
.flxw{-webkit-flex-wrap: wrap;-ms-flex-wrap: wrap;flex-wrap: wrap;}

/* 空要素非表示 */
.empty:empty{display: none;}

/* 位置 */
.posr{position: relative;}

/* テキスト */
.fwb{font-weight: bold;}
.tac{text-align: center;}
.tar{text-align: right;}
.tdu{text-decoration: underline;}
.tdu:hover{text-decoration: none;}
.wsnw{white-space: nowrap;}

/* 文字色 */
[data-textcolor="white"]{color: var(--white);}
[data-textcolor="black"]{color: var(--black);}

[data-textcolor="mostblack"]{color: var(--mostblack);}


[data-textcolor="blue"]{color: var(--blue);}
[data-textcolor="grey"]{color: var(--grey);}
[data-textcolor="smoke"]{color: var(--smoke);}
[data-textcolor="green"]{color: var(--green);}
[data-textcolor="red"]{color: var(--red);}
[data-textcolor="yellow"]{color: var(--yellow);}
[data-textcolor="emerald"]{color: var(--emerald);}
[data-textcolor="orange"]{color: var(--orange);}
[data-textcolor="dark"]{color: var(--dark);}
[data-textcolor="semigrey"]{color: var(--semigrey);}

/* 背景色 */
[data-bgcolor="white"]{background-color: var(--white);}
[data-bgcolor="blue"]{background-color: var(--blue);}
[data-bgcolor="grey"]{background-color: var(--grey);}
[data-bgcolor="smoke"]{background-color: var(--smoke);}
[data-bgcolor="green"]{background-color: var(--green);}
[data-bgcolor="red"]{background-color: var(--red);}
[data-bgcolor="yellow"]{background-color: var(--yellow);}
[data-bgcolor="emerald"]{background-color: var(--emerald);}
[data-bgcolor="orange"]{background-color: var(--orange);}
[data-bgcolor="dark"]{background-color: var(--dark);}
[data-bgcolor="black"]{background-color: var(--black);}
[data-bgcolor="semigrey"]{background-color: var(--semigrey);}
[data-bgcolor="semismoke"]{background-color: var(--semismoke);}

/* サイズ */
.w100p{width: 100%;}
.w80p{width: 80%;}
.w50p{width: 50%;}
.w25p{width: 25%;}

/* Align */
.tac{text-align: center;}
.tar{text-align: right;}
.vat{vertical-align: top;}
.vam{vertical-align: middle;}

/* margin */
.mt{margin-top: 1em;}
.mt[data-size="0.75"]{margin-top: 0.75em;}
.mt[data-size="0"]{margin-top: 0em;}
.mt[data-size="2"]{margin-top: 1.5em;}

.ml{margin-left: 1em;}
.mlr{margin-left: auto;margin-right: auto;}

/* padding */
.pl{padding-left: 1em;}

/* overflow */
.ovh{overflow: hidden;}
.ovy{-ms-overflow-y: auto;overflow-y: auto;}
.ovx{-ms-overflow-x: auto;overflow-x: auto;}

/* 単位の表示 */
[data-textbefore]::before{content: attr(data-textbefore)" ";}
[data-textafter]::after{content: attr(data-textafter)" ";}

/* 角丸 */
.pill{border-radius: 50rem;}
.circle{border-radius: 50%;}

/* ボタン */
.curp{cursor: pointer;}

/* 影 */
.bxsd{
    -webkit-box-shadow: 0px 3px 3px 0 rgba(0,0,0,.1);
            box-shadow: 0px 3px 3px 0 rgba(0,0,0,.1);
}

.pe-n{
    pointer-events: none;
}

/* =====================
  ロゴ
===================== */
.main-logo path{
    fill:#b983b5;
}

/* =====================
  FontAwesome
==================== */
i.fas.right{margin-left: 0.5em;}
i.fas.left,
i.far.left{
    margin-right: 0.5em;
}

/* =====================
  トグル チェックボックス
  .u-switch > .u-switch-in > input[type="checkbox"][name="hoge"][id="fuga"] + i[data-ontext="ON"][data-offtext="OFF"] + label[for="huga"]
===================== */
.u-switch{
    width: var(--u-switch-Width, 64px);
}
.u-switch-in{
    position: relative;
    line-height: 1;
    width: 100%;
    height: var(--u-switch-in-Height);
}
.u-switch-in input{
    display: none;
}
.u-switch-in input,
.u-switch-in label{
    position: absolute;
    top: 0;
}
.u-switch-in i{
    width: 100%;
    height: var(--u-switch-in-Height);
    position: relative;
    display: inline-flex;
    -webkit-align-items: center;
            align-items: center;
    -webkit-justify-content: center;
            justify-content: center;
    border: 1px solid #ddd;
    background: #f1f1f1;
    -webkit-border-radius: 50rem;
            border-radius: 50rem;
    z-index: 1;
    transition: background 350ms ease 0s,left 350ms ease 0s,right 350ms ease 0s,border 350ms ease 0s,color 350ms ease 0s;
    pointer-events: none;
}
.u-switch-in i::before,
.u-switch-in i::after{
    pointer-events: none;
    font-size: var(--u-switch-in-i-Fz, 10px);
    line-height: 1;
    font-family: "Arial", "Consolas", "Courier New", "Meiryo", monospace;
    font-style: normal;
    position: absolute;
    top: 50%;
}
.u-switch-in i::before{
    width: var(--u-switch-in-i-before-Size, 26px);
    height: var(--u-switch-in-i-before-Size, 26px);
    content: "";
    display: block;
    background: #fff;
    -webkit-border-radius: 50%;
            border-radius: 50%;
    z-index: 3;
    left: var(--u-switch-in-i-before-Left, 2px);
    -webkit-transform: translateY(-50%);
       -moz-transform: translateY(-50%);
        -ms-transform: translateY(-50%);
         -o-transform: translateY(-50%);
            transform: translateY(-50%);
    transition: background 350ms ease 0s,left 350ms ease 0s,right 350ms ease 0s,border 350ms ease 0s,color 350ms ease 0s;
    -webkit-box-shadow: 1px 1px 2px 0 rgba(0,0,0,.1);
            box-shadow: 1px 1px 2px 0 rgba(0,0,0,.1);
}
.u-switch-in i::after{
    content: attr(data-offtext);
    display: inline-block;
    top: 50%;
    right: var(--u-switch-in-i-after-Right, 10px);
    z-index: 3;
    -webkit-transform: translateY(-50%);
       -moz-transform: translateY(-50%);
        -ms-transform: translateY(-50%);
         -o-transform: translateY(-50%);
            transform: translateY(-50%);
}
.u-switch-in input:checked + i{
    background: #218838;
    border: 1px solid #218838;
}
.u-switch-in input:checked + i::before{
    background: #fff;
    left: var(--u-switch-in-ipt-before-Left ,calc( 100% - 26px - 2px ));
}
.u-switch-in input:checked + i::after{
    content: attr(data-ontext);
    color: #fff;
    left: var(--u-switch-in-ipt-before-After,10px);
    right: auto;
}
.u-switch-in label{
    line-height: 1;
    cursor: pointer;
    display: block;
    width: 100%;
    height: 100%;
    top: 50%;
    left: 50%;
    -webkit-transform: translate(-50%, -50%);
       -moz-transform: translate(-50%, -50%);
        -ms-transform: translate(-50%, -50%);
         -o-transform: translate(-50%, -50%);
            transform: translate(-50%, -50%);
    z-index: 3;
}

/* =====================
  フォーム部品 単体 input
===================== */
select.u-form-parts,
textarea.u-form-parts,
input:not([type="radio"]).u-form-parts{
    background-color: #fafafa;
    padding: 0.78em 1em;
    -webkit-border-radius: 5px;
            border-radius: 5px;
    border: 1px solid #ddd;
    font-size: var(--fz-middle);
}
textarea.u-form-parts{
    min-height: 250px;
}
select.u-form-parts:focus,
textarea.u-form-parts:focus,
input:not([type="radio"]).u-form-parts:focus{
    background-color: #FFF;
}

/* =====================
  単位付き input[text],select
  .u-inputwith > label[for="hoge"][data-unit="￥"][data-position="before/after"] > input/select[id="hoge"]
===================== */
.u-inputwith label{
    position: relative;
    display: flex;
    -webkit-align-items: center;
    align-items: center;
}
.u-inputwith label::before,
.u-inputwith label::after{
    line-height: 0;
    padding: var(--u-inputwith-label-Padding,1.3em 0.8em);
    min-width: var(--u-inputwith-label-MinWidth,37px);
    min-height: var(--u-inputwith-MinHeight, 47px);
    font-size: var(--u-inputwith-Fz,15px);
    display: inline-block;
    vertical-align: bottom;
    background-color: #eee;
    border: 1px solid #ddd;
    pointer-events: none;
}
.u-inputwith label[data-position="before"]::before{
    content: attr(data-unit);
    border-radius: 5px 0 0 5px;
}
.u-inputwith label[data-position="after"]::after{
    content: attr(data-unit);
    border-radius: 0 5px 5px 0;
}
.u-inputwith select,
.u-inputwith input{
    min-height: var(--u-inputwith-MinHeight,47px);
    padding: var(--u-inputwith-ipt-Padding,calc(0.5em + 1.5px) 0.75em);
    line-height: 1;
    vertical-align: top;
    border-top: 1px solid #ddd;
    border-bottom: 1px solid #ddd;
    flex: 1;
    width: 1%;
    background-color: #fafafa;
}
.u-inputwith select:focus,
.u-inputwith input:focus{
    background-color: #fff;
}
select.u-form-parts,
.u-inputwith select{
    padding-right: var(--u-inputwith-select-PaddingR, 2em);
    background-position: var(--u-inputwith-select-Bgp, 97% center);
    background-size: var(--u-inputwith-select-BgZ,10px 10px);
    background-repeat: no-repeat;
    background-image: url('data:image/svg+xml;charset=utf8,%3C%3Fxml%20version%3D%221.0%22%20encoding%3D%22iso-8859-1%22%3F%3E%3Csvg%20version%3D%221.1%22%20id%3D%22Capa_1%22%20xmlns%3D%22http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg%22%20x%3D%220px%22%20y%3D%220px%22%20viewBox%3D%220%200%20213.333%20213.333%22%20style%3D%22enable-background%3Anew%200%200%20213.333%20213.333%3B%22%20xml%3Aspace%3D%22preserve%22%3E%20%3Cstyle%3E%20polygon%7B%20fill%3A%23333%3B%20%7D%20%3C%2Fstyle%3E%20%3Cg%3E%20%3Cg%3E%20%3Cpolygon%20points%3D%220%2C53.333%20106.667%2C160%20213.333%2C53.333%22%3E%3C%2Fpolygon%3E%20%3C%2Fg%3E%20%3C%2Fg%3E%20%3Cg%3E%3C%2Fg%3E%20%3Cg%3E%3C%2Fg%3E%20%3Cg%3E%3C%2Fg%3E%20%3Cg%3E%3C%2Fg%3E%20%3Cg%3E%3C%2Fg%3E%20%3Cg%3E%3C%2Fg%3E%20%3Cg%3E%3C%2Fg%3E%20%3Cg%3E%3C%2Fg%3E%20%3Cg%3E%3C%2Fg%3E%20%3Cg%3E%3C%2Fg%3E%20%3Cg%3E%3C%2Fg%3E%20%3Cg%3E%3C%2Fg%3E%20%3Cg%3E%3C%2Fg%3E%20%3Cg%3E%3C%2Fg%3E%20%3Cg%3E%3C%2Fg%3E%3C%2Fsvg%3E');
}
.u-inputwith label[data-position="before"] select,
.u-inputwith label[data-position="before"] input{
    text-align: left;
    border-right: 1px solid #ddd;
    -webkit-border-radius: 0 5px 5px 0;
            border-radius: 0 5px 5px 0;
}
.u-inputwith label[data-position="after"] select,
.u-inputwith label[data-position="after"] input{
    text-align: right;
    border-left: 1px solid #ddd;
    -webkit-border-radius: 5px 0 0 5px;
            border-radius: 5px 0 0 5px;
}

/* =====================
  ボタン
===================== */
.u-btn{
    padding: var(--u-btn-Padding,0.75em 1em);
    display: inline-flex;
    -webkit-align-items: center;
            align-items: center;
    -webkit-justify-content: center;
            justify-content: center;
    width: 100%;
    -webkit-border-radius: 3px;
            border-radius: 3px;
    color: #fff;
    font-weight: bold;
}
.u-btn.pill{
    -webkit-border-radius: 50rem;
            border-radius: 50rem;
}

/* =====================
  アップロード中
===================== */
.li-loading{
    pointer-events: none;
}
.li-loading::before{
    content: "";
    display: block;
    position: absolute;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
    z-index: 2;
    background: rgba(0,0,0,0.3);
    -webkit-border-radius: 3px;
            border-radius: 3px;
}
.li-loading::after{
    content: "";
    display: block;
    position: absolute;
    top: 0;
    left: 0;
    width: 0;
    height: 100%;
    z-index: 3;
    background: rgba(129, 148, 255, 0.5);
    animation-duration: 1000ms;
    animation-timing-function: ease;
    animation-delay: 100ms;
    animation-iteration-count: 1;
    animation-direction: normal;
    animation-fill-mode: forwards;
    animation-name: progressloading;
    overflow: hidden;
    -webkit-border-radius: 3px;
    border-radius: 3px;
}
@keyframes progressloading {
    0% {
        width: 0;
    }
    100%{
        width: 100%;
    }
}


/* =====================
  ボタンを操作不可
===================== */
.disablebtn{
    pointer-events: none;
    opacity: 0.7;
}

/* =====================
  画面を操作不可
===================== */
body.ui-lock{
    cursor: not-allowed;
    opacity: 0.9;
}
body.ui-lock * {
    cursor: not-allowed;
    pointer-events: none;
}

/* =====================
  動的要素
===================== */
.js-dynamicElement{
    display: none;
}

/* =====================
  ポップアップ
===================== */
/* .popup{
    position: fixed;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
    z-index: 200;
    background: rgba(0,0,0,.7);
    display: none;
}
.popup.on{
    display: block;
}
.popup-inner{
    background: #FFF;
    -webkit-border-radius: 5px;
            border-radius: 5px;
    position: relative;
    overflow-y: auto;
}
.popup .fwb{
    padding-bottom: 0.25em;
}


 */



/* =====================
  アラート用テキスト
===================== */
.fixtext{
    position: fixed;
    top: 0;
    left: 0;
    width: 100%;
    min-height: 1em;
    background: rgba(0,0,0,.6);
    color: #FFF;
    pointer-events: none;
    opacity: 0;
    z-index: -1;
}
.fixtext.on{
    animation-name            : fadeInOut;
    animation-duration        : 2500ms;
    animation-timing-function : cubic-bezier(0.19, 1, 0.22, 1);
    animation-delay           : 0ms;
    animation-iteration-count : 1;
    animation-direction       : alternate;
    animation-fill-mode       : none;
    animation-play-state      : running;
}
@keyframes fadeInOut {
    0%   {
        opacity: 0;
        z-index: -1;
    }
    25%  {
        opacity: 1;
        pointer-events: auto;
        z-index: 2000;
    }
    100% {
        opacity: 0;
        z-index: -1;
    }
}

.fixtext-inner{
    padding: 1em 2em;
    position: relative;
    max-width: 1200px;
    margin-left: auto;
    margin-right: auto;
}
.fixtext-inner .in-text{
    color: inherit;
}

/* color */
.fixtext[data-color="red"]{background: rgb(255, 0, 0, 0.7);}
.fixtext[data-color="green"]{background: rgba(76, 175, 80, 0.8);}
.fixtext[data-color="blue"]{background: rgba(0, 0, 175, 0.8);}
.fixtext[data-color="orange"]{color: #000;background: rgb(255, 152, 0, 0.8);}

/* =====================
  チェックボックス
===================== */
.u-inputcheck + .u-inputcheck{
    margin-top: 0.5em;
}
.u-inputcheck label{
    cursor: pointer;
    position: relative;
}
.u-inputcheck input{
    display: none;
}
.u-inputcheck label::before{
    position: absolute;
    left: 0;
    top: 0;
    content: "";
    display: inline-block;
    border: 2px solid #cccccc;
    -webkit-border-radius: 2px;
    border-radius: 2px;
}
.u-inputcheck input:checked + label{
    font-weight: bold;
    color: #fe9304;
}
.u-inputcheck input:checked + label::before{
    border: 2px solid #fe9304;
}
.u-inputcheck input:checked + label::after{
    content: "";
    background-repeat: no-repeat;
    background-position: center;
    -webkit-background-size: contain;
    -o-background-size: contain;
    background-size: contain;
    background-image: url('data:image/svg+xml;charset=utf8,%3Csvg%20height%3D%22417pt%22%20viewBox%3D%220%20-46%20417.81333%20417%22%20width%3D%22417pt%22%20xmlns%3D%22http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg%22%3E%20%3Cstyle%3Epath%7B%20fill%3A%23fe9304%7D%20%3C%2Fstyle%3E%20%3Cpath%20d%3D%22m159.988281%20318.582031c-3.988281%204.011719-9.429687%206.25-15.082031%206.25s-11.09375-2.238281-15.082031-6.25l-120.449219-120.46875c-12.5-12.5-12.5-32.769531%200-45.246093l15.082031-15.085938c12.503907-12.5%2032.75-12.5%2045.25%200l75.199219%2075.203125%20203.199219-203.203125c12.503906-12.5%2032.769531-12.5%2045.25%200l15.082031%2015.085938c12.5%2012.5%2012.5%2032.765624%200%2045.246093zm0%200%22%3E%3C%2Fpath%3E%3C%2Fsvg%3E');
    display: block;
    position: absolute;
}

/* =====================
  単位付のフォーム
===================== */
.input-wrapper{
    display: flex;
    -webkit-align-items: center;
            align-items: center;
}
.input-wrapper .input-unittext{
    padding-left: 0.75em;
    white-space: nowrap;
    flex: 1;
}

/* =====================
  Quill エディター拡張
===================== */
.ql-snow .ql-toolbar.ql-snow .ql-picker-label{
    outline: none!important;
    -webkit-box-shadow: none!important;
            box-shadow: none!important;
    border: none!important;
}
.ql-snow .ql-picker.ql-header .ql-picker-label::before,
.ql-snow .ql-picker.ql-header .ql-picker-item::before{
    content:"標準"!important;
}
.ql-snow .ql-picker.ql-header .ql-picker-label[data-value]::before,
.ql-snow .ql-picker.ql-header .ql-picker-item[data-value]::before{
    content: '見出し'attr(data-value)""!important;
    vertical-align: top;
}
.ql-snow .ql-tooltip[data-mode="video"]::before{
    content:"動画URL"!important;
}
.ql-snow .ql-tooltip[data-mode="video"] .isblank,
.ql-snow .ql-tooltip[data-mode="video"] .isblank + label{
    display: none!important;
}
.ql-snow .ql-tooltip a.ql-action::after{
    content:"変更"!important;
}
.ql-snow .ql-tooltip.ql-editing a.ql-action::after{
    content:"挿入"!important;
}
.ql-snow .ql-tooltip[data-mode="link"]::before,
.ql-snow .ql-tooltip::before{
    content:"リンク先URL"!important;
}
.ql-editor{
    position: relative;
    font-size: 14px;
    line-height: 1.6!important;
}

/* =====================
  各スタイル
===================== */
/* 見出し1 */
/* 見出し2 */
/* 見出し3 */
/* 見出し4 */
/* 見出し5 */
/* 見出し6 */
/* 標準 */
.editor-style *{
    font-family: var(--mincho);
    font-weight: 400;
    line-break: anywhere;
    line-height: 2.143;
    -ms-word-break: break-all;
    word-break: break-all;
}
.editor-style::after{
    content: "";
    display: block;
    clear: both;
}
/* B */
.editor-style strong{
    font-weight: bold;
}
.editor-style a{
    color: var(--purple);
    text-decoration: underline;
}
.editor-style img{
    max-width: 100%;
    height: auto;
    vertical-align: top;
}
.editor-style ul li{
    text-indent: -1em;
    padding-left: 1em;
    -ms-word-break: break-all;
        word-break: break-all;
}
.editor-style ul li::before{
    content: "・";
    font-weight: bold;
    color: var(--purple);
}

/* =====================
  OL
==================== */
.editor-style ol{
    counter-reset: number;
}
.editor-style ol li{
    text-indent: -1.15em;
    padding-left: 1.15em;
    -ms-word-break: break-all;
    word-break: break-all;
}
.editor-style ol li::before{
    color: inherit;
    font-weight: bold;
    padding-right: 0.25em;
    content: counter(number) ".";
    counter-increment :number;
    color: var(--purple);
}

/* =====================
  入力テキストエリア
===================== */
.js-quill > textarea{
    display: none;
}

/* =====================
  画像アップロード
===================== */
.js-quill.uploading{
    position: relative;
    pointer-events: none;
}
.js-quill.uploading::before{
    opacity: 1;
    content: "画像をアップロード中...";
    display: inline-block;
    position: absolute;
    top: 50%;
    left: 50%;
    z-index: 80000;
    color: #fff;
    padding: 0.5em 1em;
    -webkit-border-radius: 5px;
            border-radius: 5px;
    background: rgba(0,0,0,.55);
    border: 1px solid rgba(0,0,0,.8);
    font-size: 20px;
    font-weight: bold;
    transform: translate(-50%, -50%);
}
.js-quill.uploading::after{
    content: "";
    position: absolute;
    top: 0;
    left: 0;
    display: block;
    width: 100%;
    height: 100%;
    z-index: 79999;
    background: rgba(255,255,255,.5);
}


.deny{
    position: relative;
    opacity: 0.7;
    pointer-events: none;
}
.deny::after{
    content: 'プレビューでは操作できません。';
    position:absolute;
    top:50%;
    left:50%;
    white-space: nowrap;
    font-weight: bold;
    transform:translate(-50%,-50%);
}