/*=======================================================================================

    Sheet name  : サブリナグループ専用スタイルシート
    Category    : Multipurpose Themes
    Author      : studio.WaKS
    Version     : v1.0.0
    Created     : 2016.03.01
    Last update : 2016.03.01

  =======================================================================================*/
@font-face {
    font-family: "kokoro";
    src        : url("../fonts/kokoro.eot")  format('eot'),
                 url("../fonts/kokoro.woff") format('woff'),
                 url("../fonts/kokoro.otf")  format('opentype');
}
.myFontClass {
    font-family: "kokoro";
}

.blog-bg-gradient {
    background: -webkit-gradient(linear, left top, left bottom, color-stop(0, #ffffff), color-stop(0.1, #ffffff), color-stop(0.4, #ae864d), color-stop(0.6, #c5a77f), color-stop(0.85, #ffffff), color-stop(1, #ffffff));
    background: -webkit-linear-gradient(top,       #ffffff 0%, #ffffff, #ae864d 40%, #c5a77f 60%, #ffffff 85%, #ffffff 100%);
    background:    -moz-linear-gradient(top,       #ffffff 0%, #ffffff, #ae864d 40%, #c5a77f 60%, #ffffff 85%, #ffffff 100%);
    background:      -o-linear-gradient(top,       #ffffff 0%, #ffffff, #ae864d 40%, #c5a77f 60%, #ffffff 85%, #ffffff 100%);
    background:         linear-gradient(to bottom, #ffffff 0%, #ffffff, #ae864d 40%, #c5a77f 60%, #ffffff 85%, #ffffff 100%);
}

#blog-box #bg-line {
	width: 100%;
	margin: 0 auto;
	padding-top: 50px;
	background: url(../img/blog-line1.png) no-repeat 50% 0;
}
#blog-box #bg-line:after {
	content: '';
	width: 100%;
	height: 145px;
	display: block;
	background: url(../img/blog-line2.png) no-repeat 50% 100%;
	margin-top: -50px;
}
.pokepara {
	margin: -20px 27px 0;
	padding-bottom: 27px;
}
@media (max-width: 767px) {
	.pokepara {
		margin: 0 27px;
		padding-bottom: 27px;
	}
}

.btn-origin-color {
	background: #E63B72;
	color: #fff;
	margin-left:10px;
	padding: 10px 30px;
	font-size: 16px;
}
.btn-origin-color:hover {
    background: #B11569;
	color: #fff;
}
@media (max-width: 767px) {
.btn-origin-color {
	margin-left:0;
	padding: 5px 15px 3px;
	font-size: 14px;
}
}

.justify {
  text-align: justify;
  text-justify: inter-ideograph;
}
body {
    font-family: "kokoro", "ヒラギノ角ゴ Pro W3", "Hiragino Kaku Gothic Pro", "メイリオ", Meiryo, Osaka, "ＭＳ Ｐゴシック", "MS PGothic", sans-serif;
}
p {
    margin:      0 0 30px;
    font-size:   16px;
    line-height: 26px;
    color:       #3D2500;
}
.img-responsive {
    margin: 0 auto;
    width:  auto;
}
.relative {
    position: relative;
}
.btn-center {
    display:    block;
    text-align: center;
    margin:     36px auto 0;
    max-width:  300px;
}
.space10  { margin-bottom:  10px; }
.space20  { margin-bottom:  20px; }
.space30  { margin-bottom:  30px; }
.space40  { margin-bottom:  40px; }
.space50  { margin-bottom:  50px; }
.space60  { margin-bottom:  60px; }
.space70  { margin-bottom:  70px; }
.space80  { margin-bottom:  80px; }
.space90  { margin-bottom:  90px; }
.space100 { margin-bottom: 100px; }
.page-content {
    padding: 30px 0;
}
.btn-pink {
    background-color: #FA93A6;
    color:#FFF;
}
a.white-text {
    color:#FFF;
    padding-top: 15px;
}
a.white-text:hover {
    text-decoration: underline;
}

/*---------------------------------------------------------------------------------------
    テーマで使用するカラー設定
  ---------------------------------------------------------------------------------------*/
::-webkit-selection {
    background-color: #D6B161;
               color: #FFF;
    text-shadow:      none;
}
::-moz-selection {
    background-color: #D6B161;
               color: #FFF;
    text-shadow:      none;
}
::selection {
    background-color: #D6B161;
               color: #FFF;
    text-shadow:      none;
}
/*---------------------------------------------------------------------------------------
    背景スタイル
  ---------------------------------------------------------------------------------------*/
.boxed .wrapper {
    background-color: rgba(255,255,255,0.6) !important;
}
.boxed .wrapper.no-bg {
    background-color: rgba(255,255,255,0) !important;
}
.box-background-img.top-bg {
    background-image: url(../img/bg-image.jpg);
}
/*---------------------------------------------------------------------------------------
    トップバースタイル
  ---------------------------------------------------------------------------------------*/
.top-bar {
    height:           40px;
    line-height:      40px;
    border-bottom:    none;
    background-color: #D71D69;
}
.top-link li, .top-link li a {
    color: #FFF;
}
#primary_nav_wrap ul a {
    color: #FFF;
}
#primary_nav_wrap ul ul {
    background-color: #F27CAE;
}
#primary_nav_wrap ul li:hover {
    background-color: F27CAE;
}
#primary_nav_wrap ul ul a {
    color: #FFF;
}
/*---------------------------------------------------------------------------------------
    ヘッダースタイル
  ---------------------------------------------------------------------------------------*/
header .light-header, header.sticky .light-header {
    background-color: rgba(255,255,255,0.8) !important;
}
.menu-appear-alt {
    background-color: rgba(255,255,255,0.8) !important;
    box-shadow:       0;
}
.inquiry {
    padding:  40px;
    position: relative;
    z-index:  1;
    overflow: hidden;
    border: 5px solid #DA5277;
    background: #FFF4BD;
}
.inquiry2 {
    position: relative;
    z-index:  1;
    overflow: hidden;
    margin: 0 5px;
    padding:  15px 40px 10px;
    border: 5px solid #DA5277;
    background: #FFF4BD;
}
.intro-mobile {
    position:  absolute;
    left:      0;
    bottom:    -40px;
    max-width: 50%;
}
.downloads a {
    display:      inline-block;
    margin-right: 10px;
}
.downloads a:last-child {
    margin-right: 0;
}
@media only screen and (max-width: 992px) {
    .inquiry {
        padding:    10px 0;
        text-align: center;
    }
    .intro-mobile {
        position:  static;
        max-width: 250px;
    }
}
@media only screen and (max-width: 767px) {
    .inquiry {
        padding:    20px;
        text-align: center;
    }
}
@media only screen and (max-width: 480px) {
    header {
        margin-bottom: 52px;
    }
    .downloads a {
        margin: 5px;
    }
}

/*---------------------------------------------------------------------------------------
    メインスライダー
  ---------------------------------------------------------------------------------------*/
#mainvisual_pc {
    position: relative;
    top: 0;
    width: 100%;
    margin: 0 auto;
    z-index: 0;
}
#mainvisual_sp {
    display: none;
}
.sp-header {
    padding-top: 0px;
}
@media only screen and (max-width: 768px) {
    .tab-space {
        margin-top:52px;
    }
}
@media only screen and (max-width: 480px) {
    .tab-space {
        margin-top:0;
    }
    #mainvisual_pc {
        display: none;
    }
    #mainvisual_sp {
        display: block;
        position: relative;
        top: 0;
        width: 100%;
        margin: 52px auto 0;
        z-index: 0;
    }
    #mainvisual_sp .shop-name {
        background: -webkit-linear-gradient(left, #edce56 0%,#be8e23 50%,#edce56 100%);
        background:    -moz-linear-gradient(left, #edce56 0%,#be8e23 50%,#edce56 100%);
        background:     -ms-linear-gradient(left, #edce56 0%,#be8e23 50%,#edce56 100%);
        background:      -o-linear-gradient(left, #edce56 0%,#be8e23 50%,#edce56 100%);
        background:         linear-gradient(to right, #edce56 0%,#be8e23 50%,#edce56 100%);
        filter: progid:DXImageTransform.Microsoft.gradient(startColorstr='#be8e23', endColorstr='#edce56', GradientType=1);
        line-height: 2.1;
        font-size: 18px;
        color: #fff;
        text-align: center;
        margin-bottom: 10px;
        padding: 10px 30px;
    }
    .sp-header {
        padding-top: 25px;
    }
    .sp-common-space {
        margin-top: 22px;
    }
}

/*---------------------------------------------------------------------------------------
    TOP店舗画像紹介コンテンツ
  ---------------------------------------------------------------------------------------*/
#shopvisual_pc {
    position: relative;
    top: 0;
    width: 100%;
    margin: 0 auto;
    z-index: 0;
}
#shopvisual_sp {
    display: none;
}
@media only screen and (max-width: 767px) {
    #shopvisual_pc {
        display: none;
    }
    #shopvisual_sp {
        display: block;
        position: relative;
        top: 0;
        width: 100%;
        margin: 0 auto;
        z-index: 0;
    }
}
hr.head-border {
    background: -webkit-linear-gradient(left, #be8e23 0%,#edce56 50%,#a77623 100%);
    background: -moz-linear-gradient(left, #be8e23 0%, #edce56 50%, #a77623 100%);
    background: -ms-linear-gradient(left, #be8e23 0%, #edce56 50%, #a77623 100%);
    background: -o-linear-gradient(left, #be8e23 0%, #edce56 50%, #a77623 100%);
    background: linear-gradient(to right, #be8e23 0%,#edce56 50%,#a77623 100%);
    filter: progid:DXImageTransform.Microsoft.gradient(startColorstr='#be8e23', endColorstr='#a77623', GradientType=1);
    height:13px;
    border:0;
}

.accordion > dt > a {
    color: #FFF !important;
    border: 1px solid #B11468;
    background: #B11468;
}
.accordion > dt > a:hover,
.accordion > dt > a.active {
    color: #fff;
    border-color: #222 !important;
    background: #222 !important;
}
@media only screen and (max-width: 768px) {
    .margin-org-20 { margin-top: 20px; }
    .margin-org-30 { margin-top: 30px; }
    .margin-org-80 { margin-top: 80px; }
}
.pc-img {
    width: 100%;
    margin: 0 auto;
}
.sp-img {
    display: none;
}
@media only screen and (max-width: 768px) {
    .pc-img {
        display: none;
    }
    .sp-img {
        display: block;
    }
    .sp-space {
        margin-top:-50px;
    }
}

/*---------------------------------------------------------------------------------------
    SUB店舗画像紹介コンテンツ
  ---------------------------------------------------------------------------------------*/
#infovisual1_pc, #infovisual2_pc, #infovisual3_pc {
    position: relative;
    top: 0;
    width: 100%;
    margin: 0 auto;
    z-index: 0;
}
#infovisual1_sp, #infovisual2_sp, #infovisual3_sp {
    display: none;
}
@media only screen and (max-width: 767px) {
    #infovisual1_pc, #infovisual2_pc, #infovisual3_pc {
        display: none;
    }
    #infovisual1_sp, #infovisual2_sp, #infovisual3_sp {
        display: block;
        position: relative;
        top: 0;
        width: 100%;
        margin: 0 auto;
        z-index: 0;
    }
}
.sp-buttons {
    margin-top: 10px;
}

/*---------------------------------------------------------------------------------------
    充実の待遇ページ
  ---------------------------------------------------------------------------------------*/
.information {
    background-image: url(../img/info/bg-image.jpg);
    background-size: 100% auto;
    background-repeat: repeat-y;
}

/*---------------------------------------------------------------------------------------
    募集要項ページ
  ---------------------------------------------------------------------------------------*/
.requirement {
    background: #FFFDE4;
}
.box-background-img.top-bg.requirement {
    background: #FFFDE4;
    background-image: none;
}
.table-bordered {
    border: 3px solid #ddd!important;
}

/*---------------------------------------------------------------------------------------
    充実の待遇ページ
  ---------------------------------------------------------------------------------------*/
.treatment {
  background-image: url(../img/treatment/bg-image.jpg);
  background-position: 50% 0;
  background-size: 100% auto;
  background-repeat: repeat-y;
}

.graduate {
  background-image: url(../img/graduate/bg-image.jpg);
  background-position: 50% 0;
  background-size: 100% auto;
  background-repeat: repeat-y;
}

.voice {
  background-image: url(../img/voice/bg-image.jpg);
  background-position: 50% 0;
  background-size: 100% auto;
  background-repeat: repeat-y;
}

/*---------------------------------------------------------------------------------------
    体験入店ページ
  ---------------------------------------------------------------------------------------*/
.trial {
  background-image: url(../img/trial/bg-image.jpg);
  background-size: 100% auto;
  background-repeat: repeat-y;
}

.tab-parallax {
    background-image: url("../img/shop-bg.jpg");
  background-position: 50% 0;
  background-size: 100% auto;
  background-repeat: repeat-y;
}
.icon-box-tabs .nav>li>a {
    padding:18px 70px !important;
}

/*---------------------------------------------------------------------------------------
    よくある質問ページ
  ---------------------------------------------------------------------------------------*/
.faq {
  background-image: url(../img/faq/bg-image.jpg);
  background-size: 100% auto;
  background-repeat: repeat-y;
}
.panel-body {
    border: none;
}
.accordion > dt > a:before {
    content: "\f08a";
    width: 15px;
    height: 15px;
    margin-top: -8px;
    position: absolute;
    top: 50%;
    left: 10px;
    font-family: 'FontAwesome';
    speak: none;
    font-style: normal;
    font-weight: normal;
    font-variant: normal;
    text-transform: none;
    font-size: 16px;
    line-height: 15px;
    text-align: center;
    color: #FFF;
    -webkit-font-smoothing: antialiased;
}
.accordion > dt > a:hover:before,
.accordion > dt > a.active:before,
.accordion > dt > a:hover:after,
.accordion > dt > a.active:after {
    color: #B11468;
}
.accordion > dt > a:after {
    color: #FFF;
}
.accordion > dt > a {
    padding-left: 32px;
    border: 1px solid #E96DA4;
    background: #E96DA4;
    letter-spacing: 0px;

}
.icon-box-tabs .nav > li > a {
    padding:18px 70px !important;
}
.nav-tabs-justified > li > a,
.nav-tabs.nav-justified > li > a {
    border-bottom: 3px solid #ddd;
    border-radius: 2px 2px 0 0;
}
.nav-tabs-justified > li > a:hover,
.nav-tabs.nav-justified > li > a:hover {
    border-bottom: 3px solid #BEB374;
}
.nav-tabs-justified > .active > a,
.nav-tabs.nav-justified > .active > a,
.nav-tabs-justified > .active > a:hover,
.nav-tabs.nav-justified > .active > a:hover,
.nav-tabs-justified > .active > a:focus,
.nav-tabs.nav-justified > .active > a:focus {
    border-bottom: 3px solid #BEB374;
    background-color: #EEA1E6;
    color: #FFF;
}

@media only screen and (max-width: 767px) {
    .row {
        margin-right: -10px;
        margin-left:  -10px;
    }
    .col-xs-1, .col-xs-2, .col-xs-3, .col-xs-4, .col-xs-5, .col-xs-6, .col-xs-7, .col-xs-8, .col-xs-9, .col-xs-10, .col-xs-11, .col-xs-12,
    .col-sm-1, .col-sm-2, .col-sm-3, .col-sm-4, .col-sm-5, .col-sm-6, .col-sm-7, .col-sm-8, .col-sm-9, .col-sm-10, .col-sm-11, .col-sm-12,
    .col-md-1, .col-md-2, .col-md-3, .col-md-4, .col-md-5, .col-md-6, .col-md-7, .col-md-8, .col-md-9, .col-md-10, .col-md-11, .col-md-12,
    .col-lg-1, .col-lg-2, .col-lg-3, .col-lg-4, .col-lg-5, .col-lg-6, .col-lg-7, .col-lg-8, .col-lg-9, .col-lg-10, .col-lg-11, .col-lg-12 {
        padding-right: 5px;
        padding-left:  5px;
    }
    .faq-space {
        margin-right: 25px;
        margin-left:  25px;
    }
    .top-space {
        margin-top:-10px;
    }
    button {
        padding: -50px 0;
    }
    .widget .avatar {
        margin-bottom: 15px;
    }
    .nav-justified > li, .nav-tabs.nav-justified > li {
        display: table-cell;
        width: 1%;
    }
}
/* - Newsletter   //----------------- */
#newslater-popup {
	width: 50%;
    margin: 0 auto;
    position: relative;
	border: 1px solid #000;
}
.nl-popup-main {
    display: block;
}
.nl-popup-inner {
    display: block;
}
.nl-popup-inner img {
	width: 100%;
}
#newslater-popup button.mfp-close {
  	color: #000;
  	opacity: 1;
  	top: 5px;
  	right: 5px;
}
#newslater-popup button.mfp-close:hover,
#newslater-popup button.mfp-close:focus {
	color: #595959;
}
@media (max-width: 767px) {
	#newslater-popup {
		width: 96%;
	}
	#newslater-popup button.mfp-close {
		top: -10px;
		right: -10px;
	}
}
/* Bnr
-----------------------------------------*/
.banner {
	position: relative;
	margin: 0 auto;
	width: 511px;
	display: none;
}
.banner .banner-image {
	position: fixed;
	bottom: 10px;
	left: 10px;
	z-index: 88;
}
.banner-inner-image {
	max-width: 90%;
	height: auto;
}
.banner .banner-inner-image a {
	display: block;
}
.banner .banner-image p.close {
	position: absolute;
	right: 10%;
	top: -30px;
	text-shadow: none;
	filter: alpha(opacity=100);
	opacity: 1;
	background-color: #303131;
	color: #FFF;
	font-weight: normal;
}
.banner .banner-image p.close:hover,
.banner .banner-image p.close:focus {
	background-color: #B4862C;
	color: #FFF;
	text-decoration: none;
	cursor: pointer;
	filter: alpha(opacity=100);
	opacity: 1;
}
.banner .banner-image p.close a {
	display: block;
	width: 30px;
	height: 30px;
	text-align: center;
}
.banner .banner-image p.close a span {
	display: block;
	width: 1px;
	height: 1px;
}
.banner .banner-image p.close a i {
	font-size: 20px;
	z-index: 888;
	color: #FFF;
	line-height: 30px;
}

