@charset "utf-8";
/* CSS Document */

html{
    height: 100%;
}

body{
    font-family: 'メイリオ', Meiryo, 'ヒラギノ角ゴ Pro W3', 'Hiragino Kaku Gothic Pro', 'ＭＳ Ｐゴシック', 'MS PGothic', sans-serif;
    -webkit-text-size-adjust: none;
    background-color: #F0F0F0;

    /* フッター固定 */
    position: relative;
    min-height: 100%;
    height: auto !important;
    height: 100%;

}

.pb200{
    padding-bottom: 190px;
}

#header{
background-color: #FFF;
margin-bottom: 15px;

}
.navbar-default .navbar-collapse,
.navbar-default .navbar-form {
background-color: #FFF;
}

.navbar-right{
}
.navbar-toggle{
    margin-top: 25px;
}

.front-body-top {
    margin-top: 100px
}
#footer{
background-color: #666666;

/* フッター固定 */
position: absolute;
bottom: 0;
width: 100%;

}

.container {

}
.main{
    background-color: #fff;
    margin-bottom: 15px;
    border-top: 4px solid #205897;

}

h1 {
    font-size: 24px;
    color: #006699;
    font-weight: bold;


}



.page-header {
    padding-left: 20px;
    margin-top: 15px;

}

/* labelがニョキってでてくるやつ
.float-label-control { position: relative; margin-bottom: 1.5em; }
    .float-label-control ::-webkit-input-placeholder { color: #aaa; }
    .float-label-control :-moz-placeholder { color: #aaa; }
    .float-label-control ::-moz-placeholder { color: #aaa; }
    .float-label-control :-ms-input-placeholder { color: #aaa; }
    .float-label-control input:-webkit-autofill,
    .float-label-control textarea:-webkit-autofill { background-color: transparent !important; -webkit-box-shadow: 0 0 0 1000px white inset !important; -moz-box-shadow: 0 0 0 1000px white inset !important; box-shadow: 0 0 0 1000px white inset !important; }
    .float-label-control input, .float-label-control textarea, .float-label-control label { font-size: 1.3em; }
        .float-label-control input:focus,
        .float-label-control textarea:focus { box-shadow: none; -webkit-box-shadow: none; border-bottom-width: 2px; padding-bottom: 0; }
        .float-label-control textarea:focus { padding-bottom: 4px; }
    .float-label-control input, .float-label-control textarea { display: block; outline: none; margin: 0px; background: none; }
    .float-label-control textarea { }
    .float-label-control label { position: absolute; font-weight: normal; top: -1.3em; left: 0.08em; color: #aaaaaa; z-index: -1; font-size: 0.85em; -moz-animation: float-labels 300ms none ease-out; -webkit-animation: float-labels 300ms none ease-out; -o-animation: float-labels 300ms none ease-out; -ms-animation: float-labels 300ms none ease-out; -khtml-animation: float-labels 300ms none ease-out; animation: float-labels 300ms none ease-out;
     /* There is a bug sometimes pausing the animation. This avoids that.*/
     /*animation-play-state: running !important; -webkit-animation-play-state: running !important; }*/
   /* .float-label-control input.empty + label,
    .float-label-control textarea.empty + label { top: 0.1em; font-size: 1.5em; animation: none; -webkit-animation: none; }
    .float-label-control input:not(.empty) + label,
    .float-label-control textarea:not(.empty) + label { z-index: 1; }
    .float-label-control input:not(.empty):focus + label,
    .float-label-control textarea:not(.empty):focus + label { color: #aaaaaa; }
    .float-label-control.label-bottom label { -moz-animation: float-labels-bottom 300ms none ease-out; -webkit-animation: float-labels-bottom 300ms none ease-out; -o-animation: float-labels-bottom 300ms none ease-out; -ms-animation: float-labels-bottom 300ms none ease-out; -khtml-animation: float-labels-bottom 300ms none ease-out; animation: float-labels-bottom 300ms none ease-out; }
    .float-label-control.label-bottom input:not(.empty) + label,
    .float-label-control.label-bottom textarea:not(.empty) + label { top: 3em; }


@keyframes float-labels {
    0% { opacity: 1; color: #aaa; top: 0.1em; font-size: 1.5em; }
    20% { font-size: 1.5em; opacity: 0; }
    30% { top: 0.1em; }
    50% { opacity: 0; font-size: 0.85em; }
    100% { top: -1em; opacity: 1; }
}

@-webkit-keyframes float-labels {
    0% { opacity: 1; color: #aaa; top: 0.1em; font-size: 1.5em; }
    20% { font-size: 1.5em; opacity: 0; }
    30% { top: 0.1em; }
    50% { opacity: 0; font-size: 0.85em; }
    100% { top: -1em; opacity: 1; }
}

@keyframes float-labels-bottom {
    0% { opacity: 1; color: #aaa; top: 0.1em; font-size: 1.5em; }
    20% { font-size: 1.5em; opacity: 0; }
    30% { top: 0.1em; }
    50% { opacity: 0; font-size: 0.85em; }
    100% { top: 3em; opacity: 1; }
}

@-webkit-keyframes float-labels-bottom {
    0% { opacity: 1; color: #aaa; top: 0.1em; font-size: 1.5em; }
    20% { font-size: 1.5em; opacity: 0; }
    30% { top: 0.1em; }
    50% { opacity: 0; font-size: 0.85em; }
    100% { top: 3em; opacity: 1; }
}

.yubin {
    width: 100px;

}
//////////////////////////////////////////////////////////////// */
/* ////////////////////////////////////////////////////////////////

bootstrap 上書き

////////////////////////////////////////////////////////////////// */
h2{
    margin-top: 10px;
}
.navbar-brand{
    height: auto;
}
#admin .navbar{
    border-radius:0 !important;
}
.alert {
    text-align: center;
}
.form-group .alert {
    text-align: left;
    margin-top: 10px;
    padding: 8px;
    font-size: 12px;
}
.alert a{
    text-decoration: underline;
}
.alert a:hover{
    text-decoration: none;
}
.alert small{
    display: block;
}
.alert .messa_box{
    text-align: left;
    display: inline-block;
}
.alert small{
    display: block;
}

.alert .messa_box{
    text-align: left;
    display: inline-block;
}

.checkbox {

    font-weight: 100;
}

.btn-default{
    background-color: #aaa;
    color: #fff;
}
.btn-default[disabled]{
    color: #fff;
    background-color: #ddd;
}

#admin .form-horizontal td{
    padding-top: 15px;
}

i.fa {
    font-size: 125%;
    vertical-align: middle;
}
#stopModalAnotherLogin .alert,
#stopModal .alert{
    margin: 0;
}
#admin .thumbnail{
    margin-bottom: 10px;
}

/* 「#admin .container」と「.container>.navbar-header～」の数値をプラマイ0にすること */
#admin .container{
    padding-left: 5px;
    padding-right: 5px;

}
.container>.navbar-header, .container-fluid>.navbar-header, .container>.navbar-collapse, .container-fluid>.navbar-collapse {
    margin-left: -5px;
    margin-right: -5px;
}

odal-body {
position: relative;
padding: 15px;
}
.m
.modal-footer {
margin-top: 0px;
}

div.bootstrap-timepicker-widget table td input {
    width: 35px;
}
/* ///////////////////////////////////////////////////////////////////

レイアウト系

/////////////////////////////////////////////////////////////////// */
.clear {

    clear: both;
}
.block {
    display:block;
}
.nowrap{
    white-space: nowrap;
}
.p_0{
    padding: 0;
}
.pl_0{
    padding-left: 0;
}
.pl_5{
    padding-left: 5px;
}
.pl_10{
    padding-left: 10px;
}
.pr_0{
    padding-right: 0;
}
.plr_0{
    padding-left: 0;
    padding-right: 0;
}

.pb_5{
    padding-bottom: 5px;
}
.pb_10{
    padding-bottom: 10px;
}
.pb_20{
    padding-bottom: 20px;
}
.pb_40{
    padding-bottom: 40px;
}
.pb_50{
    padding-bottom: 50px;
}
.p10 {
    padding: 10px;
}
.pt_10{
    padding-top: 10px;
}
.pt_20{
    padding-top: 20px;
}
.pt_50{
    padding-top: 50px
}

.p5{
    padding:5px;
}
.p20{
    padding:20px;
}

.m5{
    margin: 5px;
}
.m10{
    margin: 10px;
}
.mt_10{
    margin-top: 10px;
}
.mb_10{
    margin-bottom: 10px;
}
.mb_20{
    margin-bottom: 20px;
}
.mb_30{
    margin-bottom: 30px;
}

.mb_50{
    margin-bottom: 50px;
}

.ml_5 {
	margin-left: 5px;
}
.w250{
    width:250px;
}

i.size56{
    font-size: 56px;
}
.linet{
    border-top: 1px solid #eee;
}
.txtcenter{
    text-align: center;
}
.txtright{
    text-align: right;
}
.txtleft{
    text-align: left;
}

.layoutC {
    margin: 0 auto;
}

.center-block {;
    margin-left: auto;
    margin-right: auto;;
    float: none;
}
.input2col label,
.input2col div
{
    padding-left: 0;
    padding-right: 0;

}

.input3col div {

    padding-right: 0px;
}

.input3col input,
 .input3col select{
    width: 30%;
    margin-right: 5px;
    float: left;
}
.input3col .left{
    float: left;
    line-height: 2.5;
}

.input3col .help-block{
    clear:both;
}
.maxwidth {
    max-width: 750px;
}
.minheight{
    min-height: 450px;
}
.fl_r{
    float: right;
}
.fl_l{
    float: left;
}
/* ///////////////////////////////////////////////////////////////////

フォーム系

/////////////////////////////////////////////////////////////////// */

.input-group .icon-addon .form-control {
    border-radius: 0;
}

.icon-addon {
    position: relative;
    color: #555;
    display: block;
}

.icon-addon:after,
.icon-addon:before {
    display: table;
    content: " ";
}

.icon-addon:after {
    clear: both;
}

.icon-addon.addon-md .inputin
 {
    position: absolute;
    z-index: 2;
    left: 23px;
    font-size: 14px;
    width: 20px;
    margin-left: -2.5px;
    text-align: center;
    padding: 10px 0;
    top: 1px;
    color: #aaa;
}

.icon-addon.addon-lg .form-control {
    line-height: 1.33;
    height: 46px;
    font-size: 18px;
    padding: 10px 16px 10px 40px;
}

.icon-addon.addon-sm .form-control {
    height: 30px;
    padding: 5px 10px 5px 28px;
    font-size: 12px;
    line-height: 1.5;
}

.icon-addon.addon-lg .fa,
.icon-addon.addon-lg .glyphicon {
    font-size: 18px;
    margin-left: 0;
    left: 11px;
    top: 4px;
}

.icon-addon.addon-md .form-control,
.icon-addon .form-control {
    padding-left: 30px;
    float: left;
    font-weight: normal;
}

.icon-addon.addon-sm .fa,
.icon-addon.addon-sm .glyphicon {
    margin-left: 0;
    font-size: 12px;
    left: 5px;
    top: -1px
}

.icon-addon .form-control:focus + .glyphicon,
.icon-addon:hover .glyphicon,
.icon-addon .form-control:focus + .fa,
.icon-addon:hover .fa {
    color: #2580db;
}


.help-block{
    margin-bottom: 0;
}


/* --- Plans ---------------------------- */
.planSelect {

}
.my_planHeader {
    text-align: center;
    color: white;
    padding-top:0.2em;
    padding-bottom:0.2em;
}
.my_planTitle {
    font-size:1.6em;
    font-weight: bold;
}
.my_planPrice {
    font-size:1.4em;
    font-weight: bold;
    line-height: 1.5;
}
.my_planDuration {
    margin-top: -0.6em;
    line-height: 2;
}

@media (max-width: 768px) {
    .my_planTitle {
        font-size:small;
    }
}

/* --- Features ------------------------- */

.my_feature {
    line-height:2.8em;
    font-weight: bold;

}
.my_feature small{
    font-size: 12px;
    font-weight: 100;
}
@media (max-width: 768px) {
    .my_feature {
        text-align: center
    }
 }

.my_featureRow {
    margin-top: 0.2em;
    margin-bottom: 0.2em;
    border: 0.1em solid rgb(163, 163, 163);
}

/* --- Plan 1 --------------------------- */
.my_plan1 {
    background: rgb(224,234,242);
}

.my_planHeader.my_plan1 a {
    background: rgb(72, 109, 139);
    color:white;
}

.my_planHeader.my_plan1 {
    background: rgb(105, 153, 193);
    border-bottom: thick solid rgb(72, 109, 139);
}

/* --- Plan 2 --------------------------- */
.my_plan2 {
    background: rgb(230,235,218);
}

.my_planHeader.my_plan2 a {
    background: rgb(108, 131, 62);
    color:white;
}

.my_planHeader.my_plan2 {
    background: rgb(134, 162, 77);
    border-bottom: thick solid rgb(108, 131, 62);
}

/* --- Plan 3 --------------------------- */
.my_plan3 {
    background: rgb(254,235,212);
}

.my_planHeader.my_plan3 a {
    background: rgb(199, 127, 40);
    color:white;
}

.my_planHeader.my_plan3 {
    background: rgb(253, 161, 49);
    border-bottom: thick solid rgb(199, 127, 40);
}




.my_planFeature {
    text-align: center;
    font-size: 1.7em;
}
.my_planFeature span{
    font-size: 12px;
}
.my_planFeature i.my_check {
    color: #FF0033;
    line-height: 1.3;
}

.my_planFeature i.my_remove {
    color: #009999;
    line-height: 1.3;
}
.my_planFeature i.my_wait,.wait {
    color: #999;
    line-height: 1.3;
}

.chushaku{
    font-size: 12px;
}
.my_featureRow .txt{
    padding: 11px;
    display: block;
}
.plantxt{
    color: #666;
    font-size: 16px !important;
    font-weight: bold;
    color: #FF0033;
    line-height: 1;
}
.plantxt del{
    font-size: 12px;
    color: #666;
    line-height: 1;
    display: block;
}

/* RADIO */

:root .regular-radio {
    display: none;
}

:root .regular-radio + label {
    -webkit-appearance: none;
    background-color: #fafafa;
    border: 4px solid #cacece;
    box-shadow: 0 1px 2px rgba(0,0,0,0.05), inset 0px -15px 10px -12px rgba(0,0,0,0.05);
    padding: 9px;
    border-radius: 50px;
    display: inline-block;
    position: relative;
}

:root .regular-radio:checked + label:after {
    content: ' ';
    width: 12px;
    height: 12px;
    border-radius: 50px;
    position: absolute;
    top: 3px;
    background: #35CCFF;
    box-shadow: none;
    text-shadow: 0px;
    left: 3px;
    font-size: 32px;
}

:root .regular-radio:checked + label {
    background-color: #FFFFFF;
    color: #99a1a7;
    box-shadow: 0 1px 2px rgba(0,0,0,0.05), inset 0px -15px 10px -12px rgba(0,0,0,0.05), inset 15px 10px -12px rgba(255,255,255,0.1), inset 0px 0px 10px rgba(0,0,0,0.1);
    border: 4px solid #35CCFF;
}

:root .regular-radio + label:active,
:root .regular-radio:checked + label:active {
    box-shadow: 0 1px 2px rgba(0,0,0,0.05), inset 0px 1px 3px rgba(0,0,0,0.1);
}

:root .big-radio + label {
    padding: 16px;
}

:root .big-radio:checked + label:after {
    width: 24px;
    height: 24px;
    left: 4px;
    top: 4px;
}

/* ラジオなのにチェックボックスデザイン IE8は通常のラジオ*/howtopaybox
:root .my_planHeader .regular-radio,
:root .howtopaybox .regular-radio,
:root .weekbox .regular-radio{
    display: none;
}

:root .my_planHeader .regular-radio + label,
:root .howtopaybox .regular-radio + label,
 :root .weekbox .regular-radio + label{
    background-color: #fafafa;
    border: 2px solid #bbb;
    box-shadow: 0 1px 2px rgba(0,0,0,0.05), inset 0px -15px 10px -12px rgba(0,0,0,0.05);
    padding: 9px;
    border-radius: 3px;
    display: inline-block;
    position: relative;
}

:root .my_planHeader .regular-radio + label:active,
:root .my_planHeader .regular-radio:checked + label:active,
:root .howtopaybox .regular-radio + label:active,
:root .howtopaybox .regular-radio:checked + label:active,
:root .weekbox .regular-radio + label:active,
:root .weekbox .regular-radio:checked + label:active
 {
    box-shadow: 0 1px 2px rgba(0,0,0,0.05), inset 0px 1px 3px rgba(0,0,0,0.1);
}

:root .my_planHeader .regular-radio:checked + label,
:root .howtopaybox .regular-radio:checked + label,
:root .weekbox .regular-radio:checked + label
 {
    border: 2px solid #f00;
    box-shadow: 0 1px 2px rgba(0,0,0,0.05), inset 0px -15px 10px -12px rgba(0,0,0,0.05), inset 15px 10px -12px rgba(255,255,255,0.1);
    color: #99a1a7;
    background-color: #e9ecee;
}

:root .my_planHeader .regular-radio:checked + label:after,
:root .howtopaybox .regular-radio:checked + label:after,
:root .weekbox .regular-radio:checked + label:after
 {
    content: '\2714';
    font-size: 14px;
    position: absolute;
    top: 0px;
    left: 3px;
    color: #ff0000;
    font-weight: bold;

    width: 12px;
    height: 12px;
    border-radius: 50px;
    position: absolute;

    background: none;
    box-shadow: none;
    text-shadow: 0px;

}


:root .my_planHeader .big-radio + label,
:root .howtopaybox .big-radio + label,
:root .weekbox .big-radio + label
 {
    padding: 10px;
}

:root .my_planHeader .big-radio:checked + label:after,
:root .howtopaybox .big-radio:checked + label:after,
:root .weekbox .big-radio:checked + label:after{
    font-size: 15px;
    left: 4px;
    font-weight: bold;
}





 .howtopaybox {
    padding-top: 30px;
 }

 .paytitle {
    padding-left: 0;
 }
.act_messerge{
    padding-bottom: 20px;
    text-align: center;
    color: #006699;
}

.act_mail{
    text-align: center;
    font-size: 16px;
    color: #666;
    padding: 40px 0;
}
.act_mail strong{
    color: #f00;
    font-weight: 100;
}
.act_mail i{
    font-size: 24px;
}

.ttl_h4{
    font-weight: bold;
    color: #006699;
    line-height: 1.3;
}

.form-horizontal .control-label {
    text-align: left;
}

.card .col-xs-4,
.card .col-xs-6,
.card .col-xs-12{
    padding-top: 5px;
    padding-bottom: 5px;
}
.card .help-block{
    padding-left: 15px;
    padding-right: 15px;
}


.juyoutxt{
    font-size: 12px;
    padding: 10px;
    border: 1px solid #eee;
    line-height: 1.5;
    height: 500px;
    overflow: scroll;
}

.conf h4{
    font-weight: bold;
    font-size: 16px;
}

.conf{
    font-size: 12px;
}

.conf .form-group {
 margin-bottom: 0px;
}

.conf a{
    text-decoration: underline;
}

.standard_box{
    text-align: center;
    padding: 5px;
    background-color: #00B5E1;
    border: 3px solid #fff;
    padding: 8px;

}
.enterpriseWrap{
    padding-left: 0;
    padding-right: 0;
}
.enterprise_ttl{
    text-align: center;
    background-color: #0099CC;
    border: 3px solid #fff;
    padding: 8px;

}
.enterprise_ttl img{
    vertical-align: top;
}
.enterprise{
    background-color: #0099CC;
}

.enterprise_box{
    text-align: center;
    background-color: #0099CC;
    border: 3px solid #fff;
    padding: 8px;

}
.checkboxBox{
    text-align: center;
    padding-top: 8px;
}

.entry_flow{
    margin-bottom: 30px;
    border: none;
    padding: 0;
}

/* ///////////////////////////////////////////////////////////////////

フッター

/////////////////////////////////////////////////////////////////// */


#footer {
    background-color: #000;
    color: #fff;
    padding-bottom: 20px;
}

#footer div.f_menu {
    background-color: #333;
}
#footer div.f_menu a{
    color:#fff;
}
#footer div.f_menu div.container {
    padding: 40px 0;
    margin-bottom: 20px;
}

#footer div.f_menu div.container div.col-md-3 {
}

#footer div.f_menu div.container div.col-md-9 {
}

#footer div.f_menu div.container div.col-md-9 ul {
    list-style: none;
    padding-left: 0;
}

#footer div.f_menu div.container div.col-md-9 ul li {
    display: inline;
    padding: 5px;
}

#footer div.copy {
    text-align: center;
}

/* //////////////////////////////////////////////////////

管理画面

/////////////////////////////////////////////////////// */
.admin_maxwidth h1.page-header{
    color: #004D99;

font-size: 18px;
line-height: 1.5;
margin-top: 15px;
position: relative;
margin-bottom: 0;
}
.admin_maxwidth h1.page-header .fukidashi{
    position: absolute;
    bottom: -18px;
    left: 50px;
    display: block;
    background-image: url("../img/fukidashi.png");
    width: 23px;
    height: 18px;
    z-index: 1;

}
.top h2.page-header{
    position: relative;
    padding-top: 10px;
    border-top: 1px solid #eee;
    color: #004D99 !important;
    margin-bottom: 30px;
}
.top h2.page-header .fukidashi{
    position: absolute;
    bottom: -18px;
    left: 50px;
    display: block;
    background-image: url("../img/fukidashi.png");
    width: 23px;
    height: 18px;
    z-index: 1;

}
#admin h2,h2 {
    font-size: 18px;
    font-weight:bold;
    color: #333;
    line-height: 2;
}


#admin h3,h3 {
    font-size: 16px;
    font-weight:bold;
    line-height:2;
    border-bottom:1px solid #ddd;
}


#admin h5{
    font-weight:bold;
    font-size: 15px;
     color: #666;
}
#admin .atention {
    color: red;
}

#admin_header {
    background-color: #000;
    position: relative;
    margin-bottom: 0px;

}
#admin_subnav{
    margin-bottom: 20px;
    background-color: #333;
    border-bottom: 1px solid #ddd;
}

.admin_maxwidth {
    max-width: 970px;

}

.submenu_lists a.inactive{
    color:#ccc;
    text-decoration: none;
    cursor: not-allowed;
}
a.inactive:hover{
    color:#999 !important;
}

#admin_subnav li.active{
    border-bottom: 2px solid #428bca;
}

.nav li:hover{
    /*border-bottom: 2px solid #36CDDE;*/
}
.navbar-nav>li>a {
    color: #fff;
}
#admin_subnav .navbar-nav>li{
    width: 160px;

}

.navbar-nav a:hover{
    background-color: #205897 !important;
}
/* bootstro */
.kaisetu{
    margin-bottom: 10px;
    background-image: url("../img/icn_wakaba.gif");
    background-repeat: no-repeat;
    background-position: 5px 2px;
    padding-left: 20px;
    background-color: #5CB85C !important;
    border-color:  #439A43 !important;

    margin-top: 5px;
    margin-left: 20px;
}
.kaisetu:hover{
    opacity: 0.7;
}
.page-header .kaisetu{
    margin-right: 30px;
}



#admin h3.popover-title{
    font-size: 14px;
}
.bootstro-nav-wrapper i{
    font-size: 13px;
}

/* bootstro おしまい*/

.bodr_left {
    border-left: 1px solid #eee;
    margin-bottom: 0;
}
.left_nav,.left_nav_company {
    height: 100%;
    padding: 0;
    margin-bottom: 10px;
    background-color: #333;
}
.left_nav_company{
    background-color: #fff;
}
.submenu_lists{
    list-style: none;
    padding: 0;
    line-height: 1.5;
    overflow: hidden;
    margin-bottom: 0 !important;
}
.submenu_lists li{
    padding: 8px 10px 8px 25px;
    position: relative;
    display: block;
    float: left;
    width: 25%;
}
.left_nav .submenu_lists li{
    padding: 8px 10px 8px 40px;
}
.left_nav .submenu_lists li:after {

    border-left: 20px solid #fff; /* 右向きの三角形を作るため左のボーダーに色を付ける */
    border-top: 20px solid transparent; /* 上のボーダーを透過に指定 */
    border-bottom: 20px solid transparent; /* 下のボーダーを透過に指定 */
    content: "";
    position: absolute;
    right: -20px; /* 一旦中央へ寄せる */
    top: -1px;
    margin-left: 0px; /* 四角形の幅の半分右へ移動する */
}
.left_nav .submenu_lists li:before {

    border-left: 20px solid #333; /* 右向きの三角形を作るため左のボーダーに色を付ける */
    border-top: 20px solid transparent; /* 上のボーダーを透過に指定 */
    border-bottom: 20px solid transparent; /* 下のボーダーを透過に指定 */
    content: "";
    position: absolute;
    right: -19px; /* 一旦中央へ寄せる */
    top: -1px;
    margin-left: 0px; /* 四角形の幅の半分右へ移動する */
    z-index: 2;
}

.left_nav_company .submenu_lists li{
    padding: 17px 10px 17px 25px;
    border-bottom: 1px solid #eee;
    display: block;
    float: left;
    width: 100%;
}
.left_nav_company .submenu_lists li.active{
    border-bottom: 2px solid #428bca !important;
}

.left_nav .submenu_lists li.active{
    border-bottom: none !important;
    background-color: #fff;
}
.left_nav .submenu_lists li.active:before{
        border-left: 20px solid #fff; /* 右向きの三角形を作るため左のボーダーに色を付ける */
    border-top: 20px solid transparent; /* 上のボーダーを透過に指定 */
    border-bottom: 20px solid transparent; /* 下のボーダーを透過に指定 */
}



.submenu_lists li.active a{
    color: #428bca;
}
.submenu_lists li.active a{
    color: #666;
}
.left_nav .submenu_lists li.active a{
    color: #222;
}
.submenu_lists a{
    color: #fff;
}
.left_nav_company .submenu_lists a{
    color: #666;
}
.children_li {
    padding: 0;

}
.children_li li{

}
.children_li .active{
    background-color: #000;
}
.submenu_lists li .atention,
.children_li li .atention{
    color: red;
    margin-left: 3px;

}

.children_li li a{
      color: #999;
     font-weight: 100;
}
.children_li li a:hover{
    color: #FFF;
    text-decoration: none;
}
.children_li li {
    padding: 10px;
     padding-left: 30px;
}
.admin_bg{
    padding: 0;
    /*background-color: #fff;*/
    margin-bottom: 15px;
    /*border: 1px solid #dedede;*/
}
.bg_white{background-color: #fff !important;}
.header_menu{
    position: relative;
    top: 84px;
    left: -201px;
}



.cover_box{
    height: 175px;
    position: relative;
    background-color: #F2F9F9;
    background-image: url("../img/cover_iphone.png");
    background-repeat: no-repeat;
    background-position: 90% 100%;
    background-size: 21%;

}
.parsonal_info{
    /*position: absolute;
    top: 25px;
    left: 50px;*/
    margin-left: 5%;
    padding-top: 5%;
    text-shadow: 1px 1px 0px #fff;
    -moz-text-shadow: 1px 1px 0px #fff;/* Firefox用 */
-webkit-text-shadow: 1px 1px 0px #fff;/* Safari,Google Chrome用 */
    position: relative;
}
.parsonal_info dl {
}
.parsonal_info dt{
    font-size: 12px;
    float: left;
    clear: both;
    padding-right: 2em;
    line-height: 1.5;
    padding-bottom: 3px;
}
.parsonal_info dd{
    display: block;
    font-size: 12px;
    line-height: 1.5;
    padding-bottom: 3px;
}
.parsonal_info dt.companyname{
    font-size: 16px;
    line-height: 1.5;
    padding-bottom: 10px;
    display: block;
    width: 100%;
}
.parsonal_info dd .atention{
    color: red;
}

 .icon_onphone{
    position: absolute;
    bottom:14%;
    left: 74%;
    width: 7%;
    background-repeat: no-repeat;
    background-size: 100%;
        border-radius: 8px;        /* CSS3草案 */
    -webkit-border-radius: 8px;    /* Safari,Google Chrome用 */
    -moz-border-radius: 8px;

}
.icon_onphone img{
    width: 100%;
}

.border_maru {
    border: 1px solid #ddd;
    padding: 5%;
    text-align: center;
    border-radius: 5px;        /* CSS3草案 */
    -webkit-border-radius: 5px;    /* Safari,Google Chrome用 */
    -moz-border-radius: 5px;   /* Firefox用 */
    margin: 5% 0;
}

.border_maru img{
    min-width: 70%;
}


/* アプリ一覧  */

#app_list_tbl{
     font-size: 12px;
     line-height: 1.5;
}
#app_list_tbl .col-sm-6{
    padding-right: 0;
    padding-left: 0;
}
.app_name img{
    float: left;
    margin: 1%;
    margin-right:5%;
    width: 60px;

}
.app_name div{

    line-height: 1.4;
    font-size: 12px;
}
.app_name button{
    float: left;
}

.app_name .col-xs-3{
    padding: 0;
}
.app_name .col-md-8{
    padding-left: 5px;
}
.app_name .col-sm-5,
.app_name .col-sm-3{
    padding: 0;
}
.app_name .col-sm-12,
.app_name .col-xs-12{
    padding: 0 !important;
}
#app_list_tbl .col-sm-7{
    padding: 0 !important;
}
#app_list_tbl .col-md-7{
    padding: 0;
    }
 #app_list_tbl .col-xs-12{
    padding: 0;
    }
.apname{
    font-weight: bold;
    padding-bottom: 5px;
}
.modifyday{
    line-height: 1.9;
    padding-top: 5px;
    padding-left: 3px !important;
    font-size: 10px !important;
}

.icn_apple {

    background-image: url("../img/icn_apple.gif");
    background-repeat: no-repeat;
    background-position: 0px 0px;
    padding: 0px 0 3px 20px;
    line-height: 1.2 !important;
    font-size: 11px !important;
}
.icn_gplay {
    background-image: url("../img/icn_gplay.gif");
    background-repeat: no-repeat;
    background-position: 0px 0px;
    padding: 0px 0 3px 20px;
    line-height: 1.2 !important;
    font-size: 11px !important;
}
.quick{
    font-size: 10px !important;
    text-align: center;
    border: 2px solid #ccc;
    border-radius: 5px;        /* CSS3草案 */
    -webkit-border-radius: 5px;    /* Safari,Google Chrome用 */
    -moz-border-radius: 5px;
    padding: 5px;   /* Firefox用 */
    white-space: nowrap;
    color:#49A6DC;
    text-decoration: none;
}
#app_list_tbl .col-xs-4 a:hover {
    text-decoration: none;
}
.quick_td .col-xs-4{
    padding-left: 5px;
    padding-right: 5px;
}
a .quick i{
    color:#49A6DC;
    font-size: 30px;
}
a .quick :hover{
    color:#49A6DC;
    font-size: 30px;
    text-decoration: none;
}



.info_iframe{
    width: 100%;
    height: 20%;
}

.step{
    border:5px solid #BBDFBD;
    border-radius: 10px;        /* CSS3草案 */
    -webkit-border-radius: 10px;    /* Safari,Google Chrome用 */
    -moz-border-radius: 10px;
    padding:5px 10px;
    text-align: center;

    box-sizing:border-box;
}
.wrap_step{
    overflow: hidden;
    zoom:1;
    position: relative;
    margin-top: 10px;
}
#db_news ul{
    padding: 0;
    list-style: none;
}
#db_news ul li{
    padding: 5px 0;
    overflow: hidden;
}
#db_news ul .date{
    font-weight: bold;
}

/*ビジュアル*/

#crop_bg {
width: 100%;
height: 100%;
/*min-height: 300px;*/
background-color: #eeeeee !important;
border: 1px solid #cccccc;
margin-right: auto;
margin-left: auto;
}
.icn_image {
    width:50px;

}

.sprash_image{
    width: 50px;
}

.preview{
    width:100px;
    height:100px;
    overflow:hidden;
    border: 1px solid #cccccc;
    margin-bottom: 20px;
}
.btn-file {
position: relative;
overflow: hidden;
margin-bottom: 15px;
}
.btn-file input[type=file] {
position: absolute;
top: 0;
right: 0;
min-width: 100%;
min-height: 100%;
font-size: 999px;
text-align: right;
filter: alpha(opacity=0);
opacity: 0;
background: red;
cursor: inherit;
display: block;
}
.themeColorBox {
    font-size: 12px;
    overflow: hidden;
}
.themeColorBox .first,
.themeColorBox .second
{
    white-space: nowrap;
    font-weight: bold;
}
.themeColorBox .third{
    padding: 5px;
}
.themeColorBox .first input[type="text"],
.themeColorBox .second input[type="text"]
{
    cursor: hand;
    text-indent: -999px;
}

.themeColorBox .help-block{
    font-size: 12px;
    white-space: nowrap;
    font-weight: 100;
}

.dotline{
    border:1px dotted #000;
    width: 1em;
    height: 1em;
    display: inline-block;
    margin: 0 3px;
}
.themeColorBox span{
    position: relative;
}
.themeColorBox .color{
    border: none;
    background-color: #FFF;
}
.excolor_clrbox{
    position: absolute;
    top:1px;
    left: 1px;
    margin-right: 2px;
    border-color: #eee;

}

.ttl_color{
    text-align: left;
    text-indent: 1em;
    font-weight: bold;
    font-size: 14px
}
.previewbox{
    padding-left: 0;

}

#sprashModal .preview{
    width: 58px;

}
#promotionalImage .preview{
    height: 53px;

}

/* チェックボックスのON・OFFスイッチスタイル
http://proto.io/freebies/onoff/
 */

.onoffswitch {
    position: relative; width: 65px;
    -webkit-user-select:none; -moz-user-select:none; -ms-user-select: none;
}
.onoffswitch-checkbox {
    display: none;
}
.onoffswitch-label {
    display: block; overflow: hidden; cursor: pointer;
    border: 2px solid #FFFFFF; border-radius: 20px;
}
.onoffswitch-inner {
    width: 200%; margin-left: -100%;
    -moz-transition: margin 0.3s ease-in 0s; -webkit-transition: margin 0.3s ease-in 0s;
    -o-transition: margin 0.3s ease-in 0s; transition: margin 0.3s ease-in 0s;
}
.onoffswitch-inner:before, .onoffswitch-inner:after {
    float: left; width: 50%; height: 24px; padding: 0; line-height: 24px;
    font-size: 14px; color: white; font-family: Trebuchet, Arial, sans-serif; font-weight: bold;
    -moz-box-sizing: border-box; -webkit-box-sizing: border-box; box-sizing: border-box;
}
.onoffswitch-inner:before {
    content: "ON";
    padding-left: 7px;
    background-color: #2FCCFF; color: #FFFFFF;
}
.onoffswitch-inner:after {
    content: "OFF";
    padding-right: 7px;
    background-color: #DEDBDB; color: #999999;
    text-align: right;
}
.onoffswitch-switch {
    width: 17px; margin: 5.5px;
    background: #FFFFFF;
    border: 2px solid #FFFFFF; border-radius: 20px;
    position: absolute; top: 0; bottom: 0; right: 37px;
    -moz-transition: all 0.3s ease-in 0s; -webkit-transition: all 0.3s ease-in 0s;
    -o-transition: all 0.3s ease-in 0s; transition: all 0.3s ease-in 0s;
}
.onoffswitch-checkbox:checked + .onoffswitch-label .onoffswitch-inner {
    margin-left: 0;
}
.onoffswitch-checkbox:checked + .onoffswitch-label .onoffswitch-switch {
    right: 0px;
}
.panelbox .col-lg-3,
.panelbox .col-md-4,
.panelbox .col-sm-4,
.panelbox .col-sm-12{
    padding-left: 3px !important;
    padding-right: 3px !important;
}
.contents_list {

}
.contents_list .edit{
    text-align: center;
}
.contents_list .switch{
    height:28px;

}
.contents_list .description{
    height: 6em;
    clear: both;
    padding-top: 8px;
}
.contents_list {
    display: block;

    padding: 10px 10px;
    border: 1px solid #36a6cc;
    margin: 10px 2px;
    border-radius: 6px;

}
.contents_list dt{
    color: #666666;
    line-height: 3;
    position: relative;
    padding-right: 0;
    font-size: 13px;
    white-space: nowrap;
    text-align: center;
}
.contents_list dt i{
    font-size: 65px;
    color: #3FB2D9;
    line-height: 1;
}
.contents_list dt i.glyphicon-map-marker{
    font-size: 50px;
}
.contents_list dd{
    font-size: 12px;
    padding-right: 0;
}
.contents_list .newflg {
    position: relative;
}
.contents_list .newflg .new{
    position: absolute;
    top:-11px;
    right: 0;
    vertical-align: top;
    line-height: 1;
}
/*多店舗時のメッセージ　コンテンツ一覧*/
.maneystore{
    text-align: left;
    font-size: 12px;
}

.maneystore h4{
    font-size: 14px;
    font-weight: bold;
}



/* スタート画面画像アップロード */
#startimg {
    background-color: #f9f9f9;
    border-top: 1px solid #eee;
    border-bottom: 1px solid #eee;
}

#startimg .ui-state-highlight {
    border: 5px dashed #4D85B3;
    background: none;
    width: 25%;
    height: 135px;
    float: left;
    margin-bottom: 20px;

}

#startModal .preview{
    width: 60px;

}


/* お知らせ */
.example{
    padding-left: 0;
}
.example_rgt{
    padding: 0
}

.memberCountWrap{  }
.memberCountWrap.col-xs-12{
  padding: 0px 0 0px 0;
}
dl.totalDl {}
dl.totalDl.col-xs-6{
    padding: 0;
}
dt.totalTitle{
    font-weight: 100;
}
dd.total {
    font-size: 47px;
    line-height: 1.2;
    text-align: right;
    padding-right: 0.5em;
    position: relative;
}
.count dd.total {
    font-size: 85px;
    line-height: 1.3;
}
dd.total span{
    font-size: 16px;
    font-weight: bold;
    line-height: 1.2;
    position: absolute;
    bottom: 3px;
    right: -8px;
}

.count dd.total span{
    bottom: 25px;
    right: -15px;
}
dl.totalAG {
    padding-top: 1em !important;
}
dt.appleTitle,
dt.googleTitle{
    float: left;
    padding-right: 5px;
    line-height: 1.5;
}
dt.appleTitle,
span.appleTitle{
    background-image: url("../img/icn_apple.gif");
    background-repeat: no-repeat;
    background-position: 10px 5px;
    padding: 3px 0 3px 25px;
}
dt.googleTitle,
span.googleTitle{
    background-image: url("../img/icn_gplay.gif");
    background-repeat: no-repeat;
    background-position: 10px 7px;
    padding: 3px 0 3px 25px;
    clear: both;
}
dd.appletotal,
dd.googletotal {
    font-size: 18px;
    line-height: 1.6;
    padding-left: 5px;
    display: block;
    float: left;
    width: 4em;
    text-align: right;

}
dd.appletotal span,
dd.googletotal span{
    font-size: 10px;

}


.pushNews {
    padding: 0;

}
.pushNews button{


}
.pushNews i:before{

}

.pushtableWrap{
    padding-top: 5px;
    font-size: 12px;
}
.pushtableWrap .txt{
    padding-left: 5px;
    padding-right: 5px;
}
.pushtableWrap .iphone,
.pushtableWrap .android{
    padding: 0 18px 0 0;
    font-size: 14px
}
.pushtableWrap .col-xs-12{
    padding-left: 0;
    padding-right: 8px;
}
/* お知らせ入力 */

.imageUploadArea{
    border: 5px dashed #eee;
    height: 200px;
    background-image: url("../img/bg_dd.gif");
    background-repeat: no-repeat;
    background-position: 50% 50%;
}

.newswrap .count {
    border: 1px solid #ccc;
    padding: 10px 5px;
    margin: 0px 0 20px ;
    border-radius: 5px;        /* CSS3草案 */
    -webkit-border-radius: 5px;    /* Safari,Google Chrome用 */
    -moz-border-radius: 5px;   /* Firefox用 */
}

.newswrap .count .totalDl{
    margin: 0;
}
.newswrap .count .totalTitle{
    padding-top: 10px;
}
.newswrap .count .total{
    padding: 0;
}

.newswrap .count .totalAG {
     margin: 0;
     padding-top: 0;

}

.newswrap .count .totalAG .appleTitle {
}



.newswrap .count .totalAG .appletotal {
    float: right;
}

.newswrap .count .totalAG .appletotal span {
}

.newswrap .count .totalAG .googleTitle {
}

.newswrap .count .totalAG .googleTitle .hidden-sm {
}

.newswrap .count .totalAG .googletotal {
    float: right;
}

.newswrap .count .totalAG .googletotal span {
}

.pickup .clickable{
    cursor: pointer;
}



.kaihei label{
    display: block;
}
.app_in,.app_out{
    display: none;
}


#NoticeAddForm canvas{
    width: 80%;
    height: auto;
    vertical-align: bottom;


}
#NoticeAddForm .progress{
    width: 80%;
    margin-bottom: 0;
    height: 2px;
}


#NoticeAddForm .previewimg{
    width: 80%;
    height: auto;
    vertical-align: bottom;

}
.pickup .panel-heading span {
    margin-top: -20px;
    font-size: 15px;
}
#admin .pickup h3 {
    font-size: 14px;
    font-weight:bold;
    line-height:1.5;
    border-bottom:none;
    padding-left: 20px;
}

.panel-info {
    border-color: #004D99 !important;
}

.panel-info>.panel-heading {
    color: #fff !important;
    background-color: #004D99 !important;
   border: none;
}
.titleclickable{
    cursor: pointer;
}
.pickup {
    font-size: 12px;
    padding-left: 0;
    padding-right: 0;
}
.pickupage input
{
    width: 35%;
    display: inline;
}
.pickupage select{
    width: 40%;
    display: inline;
}

.pickup .form-group label{
    padding: 5px 0 0 0;
}
.pickup .form-group div{
    padding: 5px 0;
}
.pickup .form-group label.inline{
    padding-right: 8px;
    padding-top: 0;
    font-weight: 100;
}

.shokushu label,
#menuEntrybox label.inline{
    font-weight: 100;
    padding-right: 15px;
    padding-top: 5px;
}

.newswrap .even{
    background-color: #f9f9f9;
}

/* 解約 */
.leave h4{
    font-size: 14px;
    font-weight: bold;
}



/* マップ */
#map .ui-state-highlight {
    border: 2px dashed #4D85B3;
    background: none;
    width: 100%;
    padding: 20px 0;
    cursor:move;
        }
ul.sortable{
    list-style: none;
    padding-left: 0;
    border-top:1px solid #ddd;
}
.sortWrap{
    display: block;
    padding-left:5px;
    padding-right:5px;

}

.sortWrap .btn{
    margin-bottom: 5px;
}

.sortable li{
    overflow:hidden;
    min-height:100%;

    padding: 10px !important;
    border-bottom: 1px solid #ddd;
    display: table;
    width:100%;
}
.ui-sortable-helper{
    display: block;

}
.ui-sortable-helper .grip{
    display: inline-block;
}
.f_left{
    float: left;
}
.f_right{
    float: right;
}
.sortWrap.even{
    background-color: #f9f9f9;
}
ul.sortable .title{
    font-weight: bold;
}
.thumb_map{
    width: 200px;
}


/* フォトギャラリー */
#photo {
        padding: 0;
}
#photo .ui-state-highlight {
    border: 2px dashed #4D85B3;
    background: none;
    width: 100%;
    padding: 40px 0;
    cursor:move;
        }

#photo .thumb_photo{
    width: 60px;
    height: 60px;
    margin-right: 10px;

}
#photo .f_right{
}
#photo .f_left{
    padding-left: 0;
}
#photo .title,
#photo .txt{
    font-size: 12px;
}
.grip{cursor: move;}
html #photo .grip,
html #coupon .grip,
html #photo_upload .grip,
html .addOriginalWrap .grip,
html .js_choice_list .grip,
html .stampCouponWrap .grip,
html #map .grip,
html .staffbox .grip,
html .menubox .grip{
    cursor: move;
    background-image:url("../img/grip.png");
    background-size: contain;
    width: 16px;
    display:table-cell;

}
.row-eq-height{
    display:-webkit-box;
    display:-moz-box;
    display:-ms-box;
    display:-webkit-flexbox;
    display:-moz-flexbox;
    display:-ms-flexbox;
    display:-webkit-flex;
    display:-moz-flex;
    display:-ms-flex;
    display:flex;
    -webkit-box-lines:multiple;
    -moz-box-lines:multiple;
    -webkit-flex-wrap:wrap;
    -moz-flex-wrap:wrap;
    -ms-flex-wrap:wrap;
    flex-wrap:wrap;

}
/* フォトギャラリー　フォト登録 */
#photo_upload {
    padding-top: 20px;
}

#photo_upload .ui-state-highlight {
    border: 2px dashed #4D85B3;
    background: none;
    width: 100%;
    padding: 40px 0;
    cursor:move;
}
#photo_upload .thumb_photo{
    width:80px;
}
#photo_upload .title,
#photo_upload .txt{
    font-size: 12px;
    margin: 8px;
}
#photo_upload .editable-click, a.editable-click, a.editable-click:hover {
text-decoration: none;
border: none;
}

#photo_upload .editable-empty{
    color: #aaa;
    width: 150px;
    border: 1px dotted #aaa;
    padding: 5px;
    border-radius: 5px;        /* CSS3草案 */
    -webkit-border-radius: 5px;    /* Safari,Google Chrome用 */
    -moz-border-radius: 5px;   /* Firefox用 */
    display: block;
    float: left;
}
.editable{
    color:#333;
}

#photo_upload .title form,
#photo_upload .txt form{
    display: inline;
}
#photo_upload .title form div,
#photo_upload .txt form div{
    display: inline;
}
#photo_upload .title input,
#photo_upload .txt input{
    display: inline;
    width:150px;
}
.editable-buttons{
    /*display: block;*/
}

#categoryNameDiv{
    margin-bottom: 0;
}



/* クーポン */
#coupon {
    padding: 0;
}

#coupon .ui-state-highlight {
    border: 2px dashed #4D85B3;
    background: none;
    width: 100%;
    padding: 30px 0;
    cursor:move;
        }
#coupon .title,
#coupon .txt{
    font-size: 12px;
}
.thumb_coupon{
    width: 200px;
}

.pickup .leave h4{
    font-size: 14px;
    font-weight: bold;
}

/* コンテンツ */
.btn-black{
    background-color: #000;
    color:#fff;
}
.btn-gplay{
    background-color: #A4CA39;
    color:#fff;
}
.btn-white{
    color:#666;
    border:1px solid #aaa;
    background-color: #fff;
}

/*0524tanaka*/
.recommend_txt{
    font-size: 14px;
    color:#0099CC;
}
.recommend_box{
    padding-bottom: 20px;
}
.recommend_btn{
    text-align: center;
}
.recommend_btn img{
    padding:5px;
    border:1px solid #3FB2D9;
    border-radius: 10px;
    margin-bottom: 4px;
}
.recommend_btn img:hover{
    border:3px solid #3FB2D9;
    margin-bottom: 0;
}

/* アプリ申請 */
#screenshot{
    background-color: #f9f9f9;
    border-top: 1px solid #eee;
    border-bottom: 1px solid #eee;
}
#screenshot .col-sm-2{
    padding-left: 5px;
    padding-right: 5px;
    width: 20%;
}

#screenshot .ui-state-highlight {
    border: 5px dashed #4D85B3;
    background: none;
    width: 20%;
    height: 135px;
    float: left;
    margin-bottom: 20px;
        }
#admin .andpro h3 {
    font-size: 14px;
    font-weight:bold;
    line-height:1.5;
    border-bottom:none;
    padding-left: 20px;
}

.andpro .clickable{
    cursor: pointer;
}

.andpro .panel-heading span {
    margin-top: -20px;
    font-size: 15px;
}
.thumb_andpro{
    width: 200px;
    margin: 10px 0;
}

.app_check{}

.app_check .ok{
    font-size: 24px;
    color: #33CC66;
}

.app_check .ng{
    font-size: 24px;
    color: #ff0033;
}

/* モーダル */
#screenshot1Modal .preview{
    width: 58px;

}
#screenshot2Modal .preview{
    width: 58px;

}
#androidModal .preview{
    height: 50px;

}

.modal-body .col-xs-8{
    padding-right: 0;

}
.modal-body .col-xs-9{
    padding-right: 0;

}

/* /////////////////////////////////////////////

アプリサポートページ

////////////////////////////////////////////// */


.app_head{
    color: #FFF;
    background-image: url("../img/bg_appsupport.jpg");
    background-size: cover;
    padding-top: 2em;
    text-align: center;
    border-bottom: 15px solid #333;
    position: relative;
    height: 10em;
}
.app_head .iconbox{
    width: 100%;
    position: absolute;
    top:4em;
}
.app_head .app_icon{
    width: 120px;
    height: 120px;
    margin: 10px auto;
    border: 1px solid #ccc;
    border-radius:20px;        /* CSS3草案 */
    -webkit-border-radius: 20px;    /* Safari,Google Chrome用 */
    -moz-border-radius: 20px;
    background-size: cover;

}
.iphonebody {
    background-image: url("../img/bg_phonebody.jpg");
    width: 220px;
    height: 470px;
    margin: 0 auto;
    position: relative;
}

.iphonebody .gamen{
    position: absolute;
    top: 69px;
    left: 20px;
    width: 184px;
    height: 329px;
}

 .app_bnrbox{
    background-image: url("../img/bg_here.gif");
    background-repeat: no-repeat;
    background-position: right center;
    padding-top: 25px;
 }
#app_support {
    background-color: #fff;
}
#app_support .fl_l{
    float: left;
}
#app_support .fl_r{
    float: right;
}
#app_support .fl_r p{
    padding-bottom: 20px;
}
#app_support .main{
    border-top: none;
    padding-top: 80px;
}

.app_maxwidth{
    max-width:970px;

}
.app_head h1{
    font-size: 22px;
    margin-bottom: 0;
    color: #FFF;
    margin-top: 0;
}
#app_support h1 span{
    font-size: 10px;
    font-weight: 100;
    margin-right: 5px;
}


#app_support .app_screenshot .col-xs-3{

    padding-left: 5px;
    padding-right: 5px;

}
#app_support .icon{
    width: 150px;
    height: 150px;
    margin-bottom: 15px;

}
#app_support .itunes{
    margin-bottom: 10px;
}
#app_support .googleplay{
     margin-bottom: 10px;
}



/*よくある質問*/
#faq {
    margin-top: -5px;
}
#faq .panel-default .panel-heading{
    color: #31708f;
    background-color: #d9edf7;
    border-color: #bce8f1;
    background-image: url("../img/img_faq_q.gif");
    background-repeat: no-repeat;
    background-position: 8px 8px;
    padding-left: 30px;

}

#faq .panel-default{
    border-color: #bce8f1;
}

#faq .panel-body{
    background-image: url("../img/img_faq_a.gif");
    background-repeat: no-repeat;
    background-position: 7px 15px;
    padding-left: 30px;
}

#faq h2{
    margin-bottom: 0px;
    line-height: 1.3;
}

#faq h3{
    margin-top: 0px;
    padding-top: 15px;
}




/*予約*/
#ReserveSettingReserveModeId1,
#ReserveSettingReserveModeId2,
#MultistoreReserveSettingReserveModeId1,
#MultistoreReserveSettingReserveModeId2
{
    display: none;

}

.reserve .radio{
  box-sizing: border-box;
  -webkit-transition: background-color 0.2s linear;
  transition: background-color 0.2s linear;
  position: relative;
  display: inline-block;
  margin: 0 20px 8px 0;
  padding: 12px 12px 12px 42px;
  border-radius: 8px;
  background-color: #f6f7f8;
  vertical-align: middle;
  cursor: pointer;
}
.reserve .radio:hover {
  background-color: #e2edd7;
}
.reserve .radio:hover:after {
  border-color: #53b300;
}
.reserve .radio:after {
  -webkit-transition: border-color 0.2s linear;
  transition: border-color 0.2s linear;
  position: absolute;
  top: 50%;
  left: 15px;
  display: block;
  margin-top: -10px;
  width: 20px;
  height: 20px;
  border: 2px solid #bbb;
  border-radius: 6px;
  content: '';
}

.reserve .radio:before {
  -webkit-transition: opacity 0.2s linear;
  transition: opacity 0.2s linear;
  position: absolute;
  top: 50%;
  left: 20px;
  display: block;
  margin-top: -5px;
  width: 10px;
  height: 10px;
  border-radius: 50%;
  background-color: #3276b1;
  content: '';
  opacity: 0;
}
.reserve input[type=radio]:checked + .radio:before {
  opacity: 1;
}

/*メンテナンス*/

i.fa.bigicon {
    font-size: 360%;
    line-height: 1.2;
}

.design-box{
    border-right:1px solid #dedede;

}
.panel-body{
  /*  margin-top: -15px;
    margin-bottom: -15px;*/
}

.thumbnail .caption h3{
    margin: 0px;
    border-bottom: 0px solid #ddd !important;

}

.d_hosoku{
    display: block;
    font-size: 11px;
    padding: 15px;
    margin-top: 30px;
    background-color: #EBF4F5;
    border-radius: 5px;        /* CSS3草案 */
    -webkit-border-radius: 5px;    /* Safari,Google Chrome用 */
    -moz-border-radius: 5px;   /* Firefox用 */
    overflow: hidden;
    zoom:1;
    line-height: 2;
}
.d_hosoku img {
    float: left;
    margin-right: 10px;
}

#design_treat{}
#design_select{
    margin-top: 20px;

}
#design_select p{
    padding: 10px 0
}
.ds_ttle{
    font-size: 18px;
    font-weight: bold;
}

/*吹き出し*/

.arrow_box {
    position: relative;
    background: #ffffff;
    border: 4px solid #666;
    padding: 10px 20px;
}
.arrow_box h4{
    font-weight: bold;
    font-size: 16px;
}

.tp_title{
    font-weight: bold;
}
.arrow_box:after, .arrow_box:before {
    right: 100%;
    top: 50%;
    border: solid transparent;
    content: " ";
    height: 0;
    width: 0;
    position: absolute;
    pointer-events: none;
}

.arrow_box:after {
    border-color: rgba(255, 255, 255, 0);
    border-right-color: #ffffff;
    border-width: 15px;
    margin-top: -15px;
}
.arrow_box:before {
    border-color: rgba(55, 63, 69, 0);
    border-right-color: #666;
    border-width: 21px;
    margin-top: -21px;
}
/*吹き出し　END*/

.nowdesign{
    position: relative;
    min-height: 350px;
}
.nowdesign .bg_smapho{
    position: absolute;
    top:0;
    width: 100%;
    margin: auto auto;

}

.nowdesign .img_tp_degign{
    position: absolute;
    top:52px;
    z-index: 2;
    width: 100%;

}

.nowdesign .img_tp_degign img{
    margin-left: 2px;
    height: 246px;
}



/*スタート*/
#demo {
  line-height: 20px;
}

#examples {
  background-color: #191919;
  background-color: rgba(0,0,0,0.3);
  padding: 5px;
  margin: 10px 0;
  overflow: hidden;
}

.contentbox {
  overflow: auto;
  position: relative;
  padding: 20px;



  -webkit-box-sizing: border-box;
  -moz-box-sizing: border-box;
  box-sizing: border-box;
}
.horizontal-images.contentbox ul, .vertical-images.content ul{
    margin: 0;
    padding: 0;
    list-style: none;
    overflow: hidden;
}

.horizontal-images.contentbox li{
    margin: 0 3px;
    float: left;
}

.vertical-images.contentbox li{ margin: 3px 0; }

.horizontal-images.contentbox li:first-child{ margin-left: 0; }

.vertical-images.contentbox li:first-child{
    margin-bottom: 3px;
    margin-top: 0;
}

.horizontal-images.contentbox li:last-child{ margin-right: 0; }

.vertical-images.contentbox li:last-child{ margin-bottom: 0; }

.horizontal-images.contentbox li img{
    width: auto;
    padding: 0;
}

.horizontal-images li{
    text-align: center;
    padding: 0 20px;
}
.horizontal-images li img{
    margin-bottom: 5px;
}
.horizontal-images li label{
    margin-bottom: 0;
}
.lay_name{
    background-color: #006699;
    font-size: 11px;
    border-radius: 4px;        /* CSS3草案 */
    -webkit-border-radius: 4px;    /* Safari,Google Chrome用 */
    -moz-border-radius: 4px;   /* Firefox用 */
    color: #fff;
    padding: 3px;
    text-align: center;
    margin-bottom: 5px;
}

.lay02_wrap{
overflow: hidden;
}
.simlater{
    float: left;
    text-align: center;
    margin-bottom: 10px;
}
.dmy_button{
    float: left;
    border: 1px solid #dedede;
    padding: 20px;
}
.color_wrap{
    position: relative;
}
.color_wrap .color{
  border: none;
  background-color: #FFF;
}
.btncolor{
    position: relative;
}

.img_uploadtxt{
    clear: both;
    padding-top: 13px;
}
.btncolor{
    margin-bottom: 10px;
}

.laybootstro{
    overflow: hidden;
}

.layout04 .menuphoto{
    display: inline-block;
}
.layout04 .menuphoto.col-lg-5,
.layout04 .menuphoto.col-md-5,
.layout04 .menuphoto.col-sm-8,
.layout04 .menuphoto.col-xs-12{
    float: none;
}
.layout04 #startimg{
    margin-top: 10px;
}

.layout04 .preview{
    width:128px;
    height: 72px;
    margin-right: 0;
}

/*スタンプ*/
.editable{
    color: #333;
    border:1px #aaa dotted !important;
    text-align: right;
    font-size: 16px;
     padding: 3px 11px !important;
}
.editable-empty{
    color: #C78D96 !important;
    font-size: 12px;
    padding: 5px 11px!important;
    border:1px solid #bbb !important;
    text-align: left !important;
}
#stamp_mantan,
#stamp_insto,
#stamp_profile,
#stamp_app,
#stamp_invite,
#stamp_limit,
#stamp_disapp,
#stamp_stance
{
    border:1px dotted #ccc;
    padding: 5px 11px;
    border-radius: 3px;

    font-weight: bold;
    display: inline-block;
    width: 90px !important;
}

.ed-error{
    border: #CC0000 solid 1px !important;
    color: #990000 !important;
    background-color: #FFecec !important;
}
.stamp_editable input,
.stamp_onoff input,
.limit .input-sm,
.notification .input-sm
{
    width: 90px !important;
}

.stamp_onoff .stamp_icn{
    text-align: center;
}
.stamp_onoff .stamp_icn i{
    font-size: 25px;
    line-height: 1;
}
.stamp_onoff .form-group{
    margin-bottom: 0;
}
.stamp_onoff td{
vertical-align:middle !important;
}
.stamp_onoff td span{
line-height: 2;
}
.stamp_onoff td .alert{
    margin-bottom: 0;
}
.stamp_onoff table .col-xs-12,
.stamp_onoff table .col-sm-6
{
    padding: 0;
}


.stampCouponWrap,
.addOriginalWrap{
    padding-top: 10px;
}
.stampCouponWrap .ui-state-highlight,
.addOriginalWrap .ui-state-highlight,
.sortableSegmentChoice .ui-state-highlight,
.staffTable .ui-state-highlight,
.menuTable .ui-state-highlight{
    border: 2px dashed #4D85B3;
    background: none;
    width: 100%;
    padding: 20px 0 !important;
    cursor:move;
        }
.example_rgt .themeColorBox{
    width: 90px;
}

.nocoupon,
.noopentime,
.nomenu,
.nostaff,
.error{
    color: #a94442;
}

.stamp_text,
#stamp_coupon,
.stamp_pass,
.stamp_onoff,
.limit,
.notification,
#addOriginal
{
    padding: 0;
}

.stamp_pass .alert{
margin-top: 0 !important;
}
.stamp_pass .btn-xs{
    margin-bottom: 10px;
}
.limit label,
.notification label{
    font-weight: 100;
    color: #333;
    margin-bottom: 0;
    font-size: 13px;
}
.limit strong,
.notification strong{
    line-height: 2.2;
    font-size: 15px;
}

/*　セグメント　*/
.segmentWrap .tick{
    position: absolute;
    bottom:-10px;
}
.trashbox .col-xs-2{
    padding-left: 0;
    line-height: 2.5;
    padding-right: 20px;
}
.trashbox .col-xs-10{
    padding-left: 5px;
    padding-right: 5px;
    padding-bottom: 5px;


    }
.trashbox .col-xs-7{
    float: right;
}

.trashbox .error{
    border: 1px #a94442 solid;
}

.trashbox .l-error{
    color: #a94442;
}


/*マスター管理*/
.border_b{
    border-bottom: 1px solid #eee;
}


/*店舗情報管理*/
#opentime,
#menuManage,
#staffManage{
    padding:0;
}
.opentimebox,
.restbox,
.menubox,
.staffbox
{
    padding-top: 10px;
}
ul.opentimeTable,
ul.restTable,
ul.menuTable,
ul.staffTable
{
    list-style: none;
    padding-left: 0px;
    border-top:1px solid #ddd;
}
.opentimeWrap,
.restWrap,
.menuWrap,
.staffWrap,
{
    display: block;
    overflow: hidden;
    padding-left:5px;
    padding-right:5px;
}
.opentimeTable li,
.restTable li,
.menuTable li,
.staffTable li

{
    padding: 10px 0;
    border-bottom: 1px solid #ddd;
    display: block;

}
.menuTable li,
.staffbox li{
display:table;
}
.opentimeWrap.even,
.restWrap.even,
.menuWrap.even,
.staffWrap.even,
{
    background-color: #f9f9f9;
}
.opentimeWrap.saturday{
    background-color: #EFF6FF;
}
.opentimeWrap.sunday{
    background-color: #FFEDED;
}
.opentimeWrap.holiday{
    background-color: #FFEDED;
}
.opentimeWrap .modal-body{
    padding: 0px;
}
ul.opentimeTable .title,
ul.restTable .title,
ul.menuTable .title,
ul.staffTable .title
{
    font-weight: bold;
}
#opentimeDialog h4,
#webDialog h4{
    font-weight: bold;
    margin-top: 5px;
    margin-bottom: 0px;
}
#opentimeDialog .form-group,
#baseDialog .form-group,
#webDialog .form-group,
#reserveDialog .form-group{
    margin: 0px;
    padding:8px 0;
    border-bottom: 1px solid #ddd;
}
#opentimeDialog .form-group.even,
#baseDialog .form-group.even,
#webDialog .form-group.even,
#reserveDialog .form-group.even
{
    background-color: #f9f9f9;
}
#opentimeDialog .modal-body,
#baseDialog .modal-body,
#webDialog .modal-body,
#reserveDialog .modal-body
{
    padding: 0px;
}
#opentimeDialog .form-control,
#baseDialog .form-control,
#webDialog .form-control,
#reserveDialog .form-control
{
    width: initial;
}
#opentimeDialog select,
#baseDialog select,
#webDialog select,
#reserveDialog select
{
    float: left;
}
#opentimeDialog .jikoku,
#baseDialog .jikoku,
#webDialog .jikoku,
#reserveDialog .jikoku
{
    padding: 6px 4px;
}


.inlineblc{

    display: inline-block;
}





.restWrap button{
    clear: both;
}
.kikanlineheight{
    line-height: 1.5;
    padding-bottom:7px;

}
.restWrap .kara{
    padding: 6px 1px;}
#opentime .alert,
.restWrap .alert{
    text-align: left;
    font-size: 12px;
    margin-bottom: 0;
    padding: 8px;
    margin-top: 3px;

}


.restWrap .form-control{
    margin-bottom: 8px;
    width: initial;
}
.restWrap label{
    margin-bottom: 0;
}
.restWrap .weekname{
    padding: 0 5px;
    font-weight: bold;
}

.restWrap .restcalendar .form-control{
    margin-bottom: 0px;
    width: 0;
    padding: 0;;
}
#admin #rest .restWrap .norestcalendar td,
#admin .form-horizontal .restWrap .restcalendar td {
    padding-top: 5px;
}

/*メニュー管理*/

#menuManage{}
.menubox,
.staffbox{
    border-bottom: 1px solid #ddd;
    padding-bottom: 20px;
}
.menuWrap{}
.wordcut{
    white-space: nowrap;
  overflow: hidden;
  text-overflow: ellipsis;
}

.menuTable .label,
.staffTable .label{
    line-height: 1.5;
    margin: 1px;
    display: inline-block;
}
.biko{
    padding-top: 20px;
}
.fuka{
    color: #666;
    background-color: #f7f7f9;
    border: 1px solid #e1e1e8;
    }
.staffTable .badge{
    padding: 5px;
}


/*サロン予約 カレンダー表示*/
.salon_head .btn_box {
    text-align: right;
}
.month_lineup nav .navbar-header button{
    margin-top: 8px;
}

.month_lineup .navbar-default{
    background-color: #fff;
}
.month_lineup li a{
    padding: 10px 10px;
}
.month_lineup .navbar-brand{
    padding: 10px 15px;
}
.month_lineup .navbar{
    border: none;
}
.month_lineup .navbar li{
    border-bottom:1px solid #dedede;
}
.month_lineup .btn-default{
    background-color: #fff;
    color: #004D99;

}
.month_lineup .navbar-nav{
    margin:0;
}
.month_lineup .container-fluid,
.month_lineup .navbar-collapse{
}
.month_lineup .btn-default:hover,
.month_lineup .btn-default:focus,
.month_lineup .btn-default:active,
.month_lineup .btn-default.active,
.month_lineup .open .dropdown-toggle.btn-default{
    background-color: #dedede;
    color: #666;
    box-shadow: none;
}
.month_lineup .navbar-brand{
    font-weight: bold;
    color: #333;
    font-size: 15px;
}

.monthbox{

}
.daybox .dayname,
.monthbox .monthname{
    text-align: center;
    font-size: 28px;
    font-weight: bold;
    width: 300px;
    line-height: 1;
    margin-bottom: 10px;
}

.schedule_summry,
.calendar_summry{
    position: relative;
}
.schedule_summry{

}
#schedule{
    clear: both;
    margin-top: 5px;
    border: 1px solid #ccc;
}
.status {

    display: inline-block;
    font-size: 11px;
    margin-left: 10px;
}
.txt_r{
    text-align: right;
}
.swatchbox{
    text-align: right;
    padding-right: 0;
}
.swatch{
    width: 2em;
    margin-right: 5px;

}
.status .allow{
    background-color: #0099cc;
}
.status .notallow{
    background-color: #FFCC33;
}
.status .cancel{
    background-color: #cccccc;
}
.daybox .next_go,
.monthbox .next_go{
    position: absolute;
    right: 0;
    top:0;
}

.daybox .next_back,
.monthbox .next_back{
    position: absolute;
    left: 0;
    top:0;
}
#calendar td{
    width: 14.285%;
}

#calendar .dropdown-menu{
    min-width: 280px;
    padding:0;
}
#calendar .dropdown{
    margin-top: 5px;
}
#calendar .dropdown .dropdown-menu li{
    padding: 3px 8px;
    border-bottom:1px solid #DEDEDE;
}
#calendar .dropdown span{
    font-size: 11px;
}
#calendar .dropdown .jikoku{
    padding-right: 5px;
    color: #666;
}
#calendar .dropdown .cus_name{
    padding-right: 5px;
    font-weight: bold;
}
#calendar .dropdown .menu_name{
    color: #666;
}
#calendar .dropdown .staffname{
    font-size: 12px;
    background-color: #3276b1;
    color: #fff;
    padding:1px 5px;
    text-align: center;
    border-radius: 10px;
    display: block;
    line-height: 1.4;
    margin-bottom: 2px;
}
#calendar .dropdown .staffname:hover{
    background-color: #C5DBEF;
    color: #3276b1;

}
#calendar .dropdown .dele_staffname{
    font-size: 12px;
    background-color: #bbb;
    color: #fff;
    padding:1px 5px;
    text-align: center;
    border-radius: 10px;
    display: block;
    line-height: 1.4;
    margin-bottom: 2px;
}
#calendar .dropdown .dele_staffname:hover{
    background-color: #ddd;
    color: #fff;

}
#calendar th{
    text-align: center;
}
#calendar .date{
    padding: 0 5px;
    line-height: 1.5;
    background-color: #3276b1;
    color: #fff;
    display: inline-block;
    width: 2em;
    text-align: center;
    margin-bottom: 3px;
}
#calendar .date:hover{
    background-color: #aaa;
}
#calendar .count{
    font-size: 10px;
    line-height: 1;
    padding-left: 5px;
}
.saturday{
    background-color: #d9edf7;
}
.sunday,
.holiday{
    background-color: #f2dede;
}
.today{
    background-color: #fcf8e3;
}
.nowork{
    background-color: #dedede;
}
.nowork_sunday{
background-image:linear-gradient(-90deg, #dedede 50%, #f2dede 50%, #f2dede);
}
.nowork_saturday{
background-image:linear-gradient(-90deg, #dedede 50%, #d9edf7 50%, #d9edf7);
}
.nowork_holiday{
background-image:linear-gradient(-90deg, #dedede 50%, #f2dede 50%, #f2dede);
}
#baseDialog h5,
#webDialog h5{
    padding-left: 15px;
    color: #333;
    padding-top: 15px;

}
.bdr_t{
    border-top: 1px solid #dedede;
}
#baseDialog .modal-footer,
#webDialog .modal-footer,
#reserveDialog .modal-footer{
    border: none;
}

#baseDialog input[type=radio],
#reserveDialog input[type=radio],
#displayTaxType input[type=radio]{
    width: 20px;
    height: 20px;
    margin-right: 5px;
    margin-top: 0px;
    vertical-align: middle;
}
#baseDialog .labelcheck,
#reserveDialog .labelcheck,
#displayTaxType .labelcheck{
    font-weight: 100;
    line-height: 2;
    padding-right:1em;
}
#webDialog .readtxt{
    padding: 15px;
}
#webDialog .urlbox{
    width: 100%;
}

#reserveDialog .multi{
    width: 100%;
}
#reserveDialog .btnbox{
    padding: 5px 0;
    clear: both;
}

#reserveDialog .help-block{
    display: block;
    clear: both;
    padding-top: 3px;
}

#menuEntrybox #startimg{
    margin-bottom: 20px;
    padding: 10px;
}
#menuEntrybox #startimg img{
    width: 100%;
    max-width: 446px;
}

#menuEntrybox .catebox{
    border-bottom: 1px solid #dedede;
    margin-bottom: 5px;
}
#menuEntrybox .catebox label a{
    color: #ccc;
}
#menuEntrybox .catebox label a:hover{
    color:#428bca;
}
/*スケジュール*/
.modal-footer .buttonwrap{
    display: inline-block;
}
.modal-footer .buttonwrap input{
    width: 100%;
}


.modal-footer .buttonbox{
    padding-top: 10px;
}

.alert button.close{
    position: absolute;
    top:10px;
    right: 10px;

}

/*スタッフ登録*/
#staffdetail{
    padding-left: 0;
    padding-right: 0;
}
.staff_detail_box{
    border-top:1px solid #dedede;
    border-bottom:1px solid #dedede;
    overflow: hidden;
    box-sizing: border-box;
    margin-top: 10px;
}
.staff_detail_box ul{
    border-left: 0;
    border-right: 0;
    border-top: 0;
    padding: 0;
    margin: 0;
    box-sizing: border-box;
}
.staff_detail_box .btn{
    margin-top: 10px;
}
.staff_detail_box ul li{

    border: 0;
}
.staff_detail_box ul li.even{
    background-color: #ededed;
    border-top: 1px solid #dedede;
    border-bottom: 1px solid #dedede;
}
.staff_detail_box .photobox{
    padding: 25px;
    text-align: center;
    border-right: 0px solid #dedede;
}

.staff_detail_box .photobox img{
    width: 70%;

}
#staff_rest .restWrap .menu_list{
    font-weight: 100;
    font-size: 12px;
}
#staff_rest .restTable .restWrap .shiftbox{
    border-bottom: 1px solid #dedede;
    padding: 0px 0 15px;
    margin-bottom: 10px;
}
#staff_rest .restTable .restWrap .shiftbox .col-md-7,
#staff_rest .restTable .restWrap .shiftbox .col-sm-12,
#staff_rest .restTable .restWrap .shiftbox .col-xs-12{
    padding-right: 0;
}
#staff_rest .restTable .restWrap .shiftbox .col-xs-12 select.form-control{
padding: 6px 6px;
}
.restcalendar .datepicker,
.norestcalendar .datepicker,
#staff_rest .datepicker {
border: 1px solid #dedede;
text-align: center;
}


.datepicker table{
    border-collapse:separate;
border-spacing:1px;
margin: 0 auto !important;
}
#staff_rest .restTable{
    padding-bottom: 20px;

}
.shiftbox .shift_title{
    font-size: 11px;
    font-weight: bold;
    padding-bottom: 5px;
    clear: both;
}


#rest{
    margin-top: 20px;
}

/*youtube*/
.iframe-center{
    padding-right: 14px !important;

}
.fluid-width-video-wrapper {
    width: 100%;
    position: relative;
    padding: 0;
    padding-top: 56.25%;
}
.fluid-width-video-wrapper iframe{
    position: absolute;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
}

#cmModal .modal-body {
    width: 100%;
    position: relative;
    padding: 0;
    padding-top: 56.25%;
}
#cmModal .modal-body iframe{
    position: absolute;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
}
#cmModal .modal-footer{
    margin-top: 0;
}
#cmModal h4{
    font-weight: bold;
}
.dashb_movie{
        width: 100%;
    position: relative;
    padding: 0;
    padding-top: 56.25%;
}
.dashb_movie iframe{
    position: absolute;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
}

/*お知らせ受信可能人数*/
.construction{
    text-align: left !important;
    margin-bottom: 0;
    font-size: 12px;
    line-height: 1.5;
    background-color: transparent;
}

.construction .col-xs-1{
    font-size: 2em;
    text-align: center;
}
/*//////////////////////


顧客管理

///////////////////////*/


label.panel-label {
  -webkit-user-select: none;
  -moz-user-select: none;
  -ms-user-select: none;
  user-select: none;
  display: block;
  width: 100%;
  color: #bdc3c7;
  cursor: pointer;
  background-color: #f0f1f1;
  -webkit-transition-property: background-color, color;
  transition-property: background-color, color;
  -webkit-transition-duration: 200ms;
  transition-duration: 200ms;
  margin-bottom:0;
}
label.panel-label:hover {
  color: #003399;
}

#panels {
  background-color: white;
}
#panels .container {
  margin: 0 auto;
  width: 100%;
}
#panels section header label.panel-label {
  padding: 12px 24px;
  box-sizing: border-box;
}
#panels section .tab-main {
  box-sizing: border-box;
  max-height: 0;
  opacity: 0;
  -webkit-transition: opacity 600ms;
  transition: opacity 600ms;
  overflow-y: hidden;
}

#panel-1-ctrl:checked ~ #panels #panel-1 .tab-main {
  max-height: initial;
  opacity: 1;
}

#panel-2-ctrl:checked ~ #panels #panel-2 .tab-main {
  max-height: initial;
  opacity: 1;
}

#panel-3-ctrl:checked ~ #panels #panel-3 .tab-main {
  max-height: initial;
  opacity: 1;
}
#panel-1-ctrl:checked ~ #tabs-list #li-for-panel-1 {
  pointer-events: none;
  cursor: default;
  -webkit-transform: translate3d(0, 1px, 0);
  transform: translate3d(0, 1px, 0);
  box-shadow: none;
  border-right: none;
}
#panel-1-ctrl:checked ~ #tabs-list #li-for-panel-1.last {
  border-right: 1px solid transparent;
}
#panel-1-ctrl:checked ~ #tabs-list #li-for-panel-1 + li {
  border-left: 1px solid #dfdfdf;
}
#panel-1-ctrl:checked ~ #tabs-list #li-for-panel-1 label.panel-label {
  background-color: white;
  color: #003399;
  padding-top: 24px;
}
#panel-1-ctrl:checked ~ #tabs-list #li-for-panel-1 label.panel-label::after {
  height: 3px;
}

#panel-2-ctrl:checked ~ #tabs-list #li-for-panel-2 {
  pointer-events: none;
  cursor: default;
  -webkit-transform: translate3d(0, 1px, 0);
  transform: translate3d(0, 1px, 0);
  box-shadow: none;
  border-right: none;
}
#panel-2-ctrl:checked ~ #tabs-list #li-for-panel-2.last {
  border-right: 1px solid transparent;
}
#panel-2-ctrl:checked ~ #tabs-list #li-for-panel-2 + li {
  border-left: 1px solid #dfdfdf;
}
#panel-2-ctrl:checked ~ #tabs-list #li-for-panel-2 label.panel-label {
  background-color: white;
  color: #003399;
  padding-top: 24px;
}
#panel-2-ctrl:checked ~ #tabs-list #li-for-panel-2 label.panel-label::after {
  height: 3px;
}

#panel-3-ctrl:checked ~ #tabs-list #li-for-panel-3 {
  pointer-events: none;
  cursor: default;
  -webkit-transform: translate3d(0, 1px, 0);
  transform: translate3d(0, 1px, 0);
  box-shadow: none;
  border-right: none;
}
#panel-3-ctrl:checked ~ #tabs-list #li-for-panel-3.last {
  border-right: 1px solid transparent;
}
#panel-3-ctrl:checked ~ #tabs-list #li-for-panel-3 + li {
  border-left: 1px solid #dfdfdf;
}
#panel-3-ctrl:checked ~ #tabs-list #li-for-panel-3 label.panel-label {
  background-color: white;
  color: #003399;
  padding-top: 24px;
}
#panel-3-ctrl:checked ~ #tabs-list #li-for-panel-3 label.panel-label::after {
  height: 3px;
}

ul#tabs-list {
  display: flex;
  list-style: none;
  text-align: center;
  border-bottom: 1px solid #dfdfdf;
  margin: 0 5px;
  padding: 0;
}
ul#tabs-list li {
  text-align: center;
  font-size: 0.875em;
  width: 18%;
  box-shadow: 0px -2px 2px rgba(0, 0, 0, 0.05);
  border-right: 1px solid #dfdfdf;
  position: relative;
}
ul#tabs-list li:hover {
  -webkit-transition: none;
  transition: none;
  border-right: none;
}
ul#tabs-list li:hover.last {
  border-right: 1px solid transparent;
}
ul#tabs-list li:hover + li {
  border-left: 1px solid #dfdfdf;
}
ul#tabs-list li label.panel-label {
  position: relative;
  padding: 24px 0;
  font-size: 0.875em;
}
ul#tabs-list li label.panel-label::after {
  content: "";
  position: absolute;
  width: 100%;
  left: 0;
  bottom: 100%;
  background-color: #003399;
  height: 0;
  -webkit-transition-property: height;
  transition-property: height;
  -webkit-transition-duration: 200ms;
  transition-duration: 200ms;
}
ul#tabs-list li label.panel-label:hover {
  padding-top: 24px;
}
ul#tabs-list li label.panel-label:hover::after {
  height: 3px;
}

.tab-main {
    width: 100%;
    margin: 0 auto;
}
.panel-radios {
  display: none;
}

.tab-main p {
  line-height: 1.8;
}
.gyaku th,
.gyaku td
{border-top:none !important;}
.gyaku tr{
    border-bottom:1px solid #ddd;
}
.gyaku td{
    padding-top:10px !important;
}
.gyaku th{
    text-indent:1em;
}

.searchbox{
    border: 1px solid #ccc;
    padding: 10px 5px;
    margin: 0px 0 20px;
    border-radius: 5px;
    -webkit-border-radius: 5px;
    -moz-border-radius: 5px;
}

.pg_right{
    text-align:right;
    display:table;
}

.js_checkbox_span{
    display: inline-block;
    padding: 10px;

    border-radius: 4px;
    margin-top: 6px;
}
.js_checkbox_span input{

    margin-left: -20px;
    position: absolute;
}
.pickup .form-group .js_checkbox_span label.inline{
    padding-left: 20px;
    line-height: 1.7;
    padding-right: 15px;
    font-size: 14px;
}
.js_cond_add{
    margin-top: 15px;
    display: block;
    border-top: 1px solid #ededed;
    padding-top: 5px;
}
.pickup .h6{
    background-color: #ededed;
    padding: 5px !important;
}
.pickup .form-group{
    margin-bottom: 0;
}


/*2018.0126*/
/*サロン予約　カレンダー最終週*/

@media (max-width: 767px)
{
.table-responsive {

    overflow-y: auto;
}
}

/*チャット機能*/
.taiou_time{
    border-radius: 10px;
    background-color: #fff;
    width: 60%;
    margin: 10px auto 0;
    padding: 10px 15px;
    font-size: 0.8em;
    text-align: center;
    color: #666;
}
div.store {
    max-width: 80%;
    float: right;
    clear: both;
    padding-top: 1.5em;
    text-align: right;
    position: relative;
    z-index: 0;
}

div.store span.voice {
    background-color: #BEF18C;
    border-radius: 20px;
    padding: 10px 15px;
    display: inline-block;
    position: relative;
    margin-right: 15px;
    text-align: left;

}

div.store span.voice:before {
transform: rotate(155deg);
    -webkit-transform: rotate(115deg);
    position: absolute;
    content: "";
    top: 4px;
    right:-8px;

    width: 30px;
    height: 30px;
    background: #19283C;
    border-radius: 0 30px 0 30px;
    background-color:#BEF18C;
    z-index: -2;

}

div.store span.voice:after {
    content: "";
    position: absolute;
    top: -10px;
    right:-8px;
    margin-left: 0;
    display: block;
    width: 30px;
    height: 30px;
    background: #FFF;
    border-radius: 30px 0 30px 0;
    z-index: -1;
    -webkit-transform: rotate(60deg);
    -moz-transform: rotate(60deg);
    -ms-transform: rotate(60deg);
    -o-transform: rotate(60deg);
    transform: rotate(60deg);
}

div.store span.voice_status {
    display: block;
    text-align: right;
    color: #999;
    font-size: 11px;
    padding-right: 40px;
}
div.store span.voice_status a.dele_m{
    font-weight: 100;
    color: #999;
    text-decoration: none;
}
/*店舗側*/

div.user {
        max-width: 80%;
    float: left;
    clear: both;
    position: relative;
    padding-top: 1.5em;
    z-index: 0;
}

div.user img {
    /*
    width: 58px;
    border-radius: 100%;
    position: absolute;
    left: 0px;
    top:1em;*/
}

div.user span.voice {
    background-color: #E4E8EB;
    border-radius: 20px;
    padding: 10px 15px;
    display: inline-block;
 position: relative;
    margin-left: 15px;

}
div.user span.voice:before {
transform: rotate(155deg);
    -webkit-transform: rotate(155deg);
    position: absolute;
    content: "";
    top: 4px;
    left:-8px;

    width: 30px;
    height: 30px;
    background: #19283C;
    border-radius: 0 30px 0 30px;
    background-color:#E4E8EB;
    z-index: -2;

}

div.user span.voice:after {
    content: "";
    position: absolute;
    top: -11px;
    left:-8px;
    margin-left: 0;
    display: block;
    width: 30px;
    height: 30px;
    background: #FFF;
    border-radius: 30px 0 30px 0;
    z-index: -1;
    -webkit-transform: rotate(20deg);
    -moz-transform: rotate(20deg);
    -ms-transform: rotate(20deg);
    -o-transform: rotate(20deg);
    transform: rotate(20deg);
}

div.user span.voice_status {
        display: block;
        clear: both;
        margin-left: 25px;
        color: #999;
    font-size: 11px;
}

.speech{
    position: fixed;
    bottom: 30px;
    left:0;
    padding:0px 2% 20px;
    background-color: #fff;
    width: 96%;
    border-top:4px double #ddd;

}

.js_chat{
    padding:0 15px;
}
.speech .ui-input-text{
    width: 82%;
    margin: 0.6em 0 !important;
}

.speech .ui-btn{

color:#3498DB;
border:none;

    width: 12%;
    position: absolute;
    right: 0;
    top: 0;

    padding: 2px 1%;
    background-color: #fff;
    border-radius: 10px;
    font-size: 1.7em;
    text-align: left;
}


.speech .ui-body-c{
    border-color: #ddd;
}
.leaveform .float-label-control{
        overflow: hidden;
    }