@charset "UTF-8";
/* CSS Document */
@font-face{
    font-family: 'Noto Sans JP';
    font-style:normal;
    font-weight: 600;
    src:
    local("Noto Sans CJK JP")
    url(//fonts.gstatic.com/ea/notosansjp/v5/NotoSansJP-Reegular.woff2) format('woff2'),

    url(//fonts.gstatic.com/ea/notosansjp/v5/NotoSansJP-Reegular.woff) format('woff'),

    url(//fonts.gstatic.com/ea/notosansjp/v5/NotoSansJP-Reegular.otf) format('opentype');
}
html{
    font-size: 62.5%;/*16px × 62.5% =10px*/
    overflow-x: hidden;
}
body{
    color:#141414;
    font-family: 'Prompt','Noto Sans JP', sans-serif;
    font-size: 1.3rem;
    font-weight: 600;
    font-feature-settings: palt;
    letter-spacing: 0.18em;
    line-height: 2.5;
    -webkit-font-smoothing: antialiased;
    -moz-osx-font-smoothing: grayscale;
 /*   -webkit-overflow-scrolling: touch;*/
}
.font-m{
    color:#141414;
    font-family:'A1明朝','A1 Mincho','YuMincho','Yu Mincho Demibold','游明朝体';
    font-weight:normal;
    font-feature-settings: palt;
    letter-spacing: 0.1em;
    line-height: 2;
    -webkit-font-smoothing: antialiased;
    -moz-osx-font-smoothing: grayscale;
}
a{
    color:#141414;
    transition: all 0.2s;
}
a:hover{
    opacity: 0.5;
}
img{
    max-width: 100%;
    height: auto;
}

/*------------------------------
 *utility
--------------------------------*/
.text-center{
    text-align: center;
}
.text-wh{
    color: #fff;
}
.img-pc{
    display: block;
}
.img-tb{
    display: none;
}
.img-sp{
    display: none;
}
.wrapper-1140{
    max-width: 1140px;
    margin:0 auto;
}
.wrapper-1020{
    max-width: 1023px;
    margin:0 auto;
}
.wrapper-960{
    max-width: 960px;
    margin: 0 auto;
}
.wrapper-810{
    max-width: 810px;
    margin: 0 auto;
}
.br-pc{
    display: block;
}
.br-tb{
    display: none;
}
.br-sp{
    display: none;
}
/*------------------------------
 *section
--------------------------------*/
.section-header{
    padding: 136px 0 60px;
}
.section-header02{
    padding: 100px 0 60px;
}
.section-header03{
    padding: 136px 0 88px;
}
.section-header04{
    padding:100px  0 40px;
}
.section-header05{
    padding: 200px 0 64px;
}
.width100 .section-header05{
    padding: 500px 0 64px;
}
.section-header07{
    padding: 100px 0 176px;
}
.section-header08{
	padding-top: 100px;
}
.section-header09{
    padding-bottom: 60px;
}
.section-subheader{
    padding-bottom: 60px;
}
.section-subheader02{
    padding-top: 100px;
}
.section-subheader03{
    padding-bottom: 136px;
}
.section-body{
    padding-bottom: 60px;
}
.section-body02{
    padding-bottom: 730px;
}
.section-body02-02{
    padding-bottom: 600px;
}
.section-body02-03{
    padding-bottom: 250px;
}
.section-body03{
    padding-bottom: 136px;
}
.section-body04{
    padding-bottom: 120px;
}
.section-body05{
    padding-bottom: 200px;
}
.section-body06{
    padding: 0;
}
.section-footer{
    padding-bottom: 100px;
}
.section-footer02{
    padding-bottom: 200px;
}
/*------------------------------
 *ページ内リンク用（ヘッダーに重ならい為）
--------------------------------*/
.cc .section-header{
    padding: 0 0 60px;
}
.cc h2{
    padding-top: 136px;
}
.sf .section-header{
    padding: 0 0 60px;
}
.sf h2{
    padding-top: 136px;
}
.bf .section-header{
    padding: 0 0 60px;
}
.bf h2{
    padding-top: 136px;
}
.sr .section-header{
    padding: 0 0 60px;
}
.sr h2{
    padding-top: 136px;
}

/*------------------------------
 *title
--------------------------------*/
.section-title__hero{
    font-size: 6.5rem;
    font-weight:bold;
    letter-spacing: 0.2em;
    line-height: 1;
    text-transform: uppercase;
}
.section-title{
    font-size: 4.8rem;
    font-weight:bold;
    letter-spacing: 0.2em;
    line-height: 1;
    text-transform: uppercase;
}
.section-title01{
    font-size: 6.5rem;
    font-weight: bold;
    letter-spacing: 0.2em;
    line-height: 1.7;
    text-transform: uppercase;
}
.section-title02{
    font-size: 4.3rem;
    font-weight:bold;
    letter-spacing: 0.2em;
    line-height: 1.5;
    text-transform: uppercase;
}
.section-title03{
    font-size: 3.2rem;
    font-weight:bold;
    letter-spacing: 0.15em;
    line-height: 1;
    text-transform: uppercase;
}
.section-title03-02{
    font-size: 3.2rem;
    font-weight:bold;
    letter-spacing: 0.2em;
    line-height: 2;
    text-transform: uppercase;
    color: #fff;
}
.section-title04{
    font-size: 4.3rem;
}
.section-title05{
    font-size: 4.8rem;
    font-weight:bold;
    letter-spacing: 0.2em;
    line-height: 1.7;
    text-transform: uppercase;
}
.section-subtitle{
    font-size: 2.2rem;
    padding-top: 40px;
}
.section-subtitle03{
    font-size: 1.7rem;
    padding-top: 16px;
}
.section-subtitle03-02{
    font-size: 1.7rem;
    padding-top: 16px;
    color: #fff;
}
.section-subtitle04{
    font-size: 3.1rem;
    font-weight: 700;
    line-height: 2;
    letter-spacing: 0.15em;
    text-transform: uppercase;
    padding-top: 40px;
}
.section-subsubtitle{
    position: relative;
    font-size: 1.7rem;
    font-weight: 600;
    padding: 40px 0 0 30px;
}
.section-subsubtitle::before{
    position: absolute;
    top: 50px;
    left:0;
    width: 3px;
    height: 50px;
    content:"";
    background: #C5B8A0;
}
.section-subsubtitle02{
    position: relative;
    font-size: 1.7rem;
    font-weight: 600;
    padding: 40px 0 0 30px;
}
.section-subsubtitle02::before{
    position: absolute;
    top: 30px;
    left:0;
    width: 3px;
    height: 50px;
    content:"";
    background: #C5B8A0;
}

/*------------------------------
 *header
--------------------------------*/
.header{
    position: fixed;
    top: 0;
    left: 0;
    z-index: 1000;
    width: 100%;
    height: 80px;
}
.header-inner{
    position: relative;
    top: 36px;
    display: flex;
    justify-content: space-between;
    align-items: center;
    width: 100%;
    height: auto;
	padding: 0 16px;
}

/*------------------------------
 *humberger-menu
--------------------------------*/
.btn-trigger{
    -webkit-appearance: none;
    appearance: none;
    position: absolute;
    top: 0;
    right: 0;
    bottom:0;
    width: 50px;
    height: 40px;
    border: none;
    outline: 0;
	background-color:rgba(255,255,255,0);
    margin: 0;
    padding: 0;
    vertical-align: top;
}
.drawer{
	position: relative;
	z-index: 110;
    transform:translateY(-20px);
}
.btn-trigger span{
	position: absolute;
    display: block;
    width: 50px;
    height: 1px;
    background-color: #141414;
    transition: all 0.5s;
    animation-duration: .5s;
    animation-delay: 75ms;
}
.btn-trigger span:first-of-type{
    transform: scaleX(0.5);
    top: 10px;
    left: 0;
    transform-origin: 0 50%;
}
.btn-trigger span:nth-of-type(2){
    top: 20px;
    transform-origin: 0 50%;
}
.btn-trigger span:last-of-type{
    top: 30px;
    width: 33px;
    transform-origin: 0 50%;
}

.btn-trigger.active span:first-of-type{
    transform: scaleX(1);
    transform: rotate(45deg);
    top: 0;
}
.btn-trigger.active span:nth-of-type(2){
    transform: rotate(-45deg);
    top: 35px;
}
.btn-trigger.active span:last-of-type{
    transform: scaleX(0);
}

/*------------------------------
 *navigation-humberger
--------------------------------*/
.header-nav{
	display: none;
    position: fixed;
    top:0;
    left:0;
    z-index:100;
    width: 100%;
    height:110%;
	box-sizing:border-box; 
    background-color: #fff;
}
.nav-list{
    margin-top:-30px;
    width: 700px;
    margin:85px auto;
}
.nav-item{
    margin-top: 30px;
}
.nav-item>a{
    font-size: 2.5rem;
    font-weight: 600;
    line-height: 0;
    text-transform: uppercase;
}
.ais-list{
    display: flex;
}
.ais-item{
    margin: 16px 0 0 16px;
}
.ais-item>a{
    font-size: 1.4rem;
    font-weight: 600;
    letter-spacing: 0.05em;
    line-height: 0;
    text-transform: uppercase;
}

/*------------------------------
 *global-navigation
--------------------------------*/
.header-navigation{
    display: block;
    opacity: 1;
}
.header-nav-list{
    display: flex;
    justify-content: space-between;
}
.header-nav-item{
    position: relative;
    margin-left: 36px;
}
.header-nav-item:first-of-type{
    margin-left: 0;
}

.header-nav-item>a{
    display: block;
    width: auto;
    height: auto;
    color: #141414;
    text-align: center;
    box-sizing: border-box;
    text-decoration: none;
}
.header-nav-item:hover>a{
    opacity: 0.5;
    fill: #6F6F6F;
}
.header-ais-list{
    position: absolute;
    top: 20px;
    display: flex;
    max-width:600px;
    width:1000%;
    margin: 0;
    padding: 0;
}
.header-ais-item{
    width: auto;
    height: 0;
    margin-left: 20px;
    overflow: hidden;
    list-style-type: none;
}
.header-ais-item:first-of-type{
    margin-left: 0;
}
.header-nav-item:hover>ul>li{
    overflow: visible;
    width: auto;
    height: 50px;
    line-height: 50px;
}
.header-ais-item>a{
    display: block;
    width: auto;
    height: 50px;
    text-align: center;
    color: #141414;
    box-sizing: border-box;
    text-decoration: none;
}
.header-ais-item>a:hover{
    opacity: 0.5;
}

.header-nav-item__link{
    font-weight:600;
    letter-spacing: 0.1em;
    text-transform: uppercase;
}
.header-ais-item__link{
    font-size: 1.1rem;
    font-weight:600;
    letter-spacing: 0.1em;
    line-height: 0;
    text-transform: uppercase;
}
.img{
    max-width: 100%;
    height: auto;
    vertical-align: middle;
}
.link{
    font-size: 1.3rem;
    font-weight: 600;
    z-index: 999;
    font-feature-settings: 'palt' 1;
    mix-blend-mode: exclusion;
}
.c-arrowUnder{
    position: relative;
    top: 0;
    margin-left: 2px;
}

/*------------------------------
 *footer
--------------------------------*/
.footer{
    position: relative;
    padding-top:200px;
    background-color: #141414;
}
.footer-nav{
    display: flex;
    padding-bottom: 200px;
}
.footer-nav-item>a{
    font-weight: 600;
    text-transform: uppercase;
    color:#fff;
}
.footer-ais-item>a{
    font-size: 1.1rem;
    font-weight: 600;
    text-transform: uppercase;
    color:#fff;
}
.footer-nav-item{
    line-height: 1.5;
    margin-bottom: 18px;
}
.footer-ais-item{
    line-height: 1.5;
    margin-bottom: 18px;
}
.footer-ais-item:first-of-type{
    padding-top: 18px;
}
.footer-nav-list{
    display: flex;
}
.footer-nav-list-01{
    padding-left: 96px;
}
.footer-nav-list-02{
    padding-left: 64px;
}
.copyrights{
    font-size: 0.9rem;
    color:#fff;
    line-height: 1;
}
.copy{
    position: absolute;
    top: 270px;
    transform: rotate(90deg);
    padding-bottom: 20px;
}
.rights{
    position: absolute;
    top: 270px;
    transform: rotate(90deg);
}
.btn-pageTop{
    display:block;
    position:absolute;
    right:40px;
    bottom:40px;
    width:14px;
    height:120px;
}

/*------------------------------
 *logo
--------------------------------*/
.logo{
    width: 180px;
}
.footer-logo{
    width: 264px;
}
.footer-logo>a{
    fill: #fff;
}

/*------------------------------
 *btn
--------------------------------*/
.btn{
    display: block;
    width: 196px;
    padding: 12px 0;
    background-color: #141414;
    color:#fff;
    font-weight: bold;
    letter-spacing: 0.2em;
    text-transform: uppercase;
}
.btn::after{
    position: relative;
    left:16px;
    content:"\f105";
    font-family: FontAwesome;
}
.service .btn{
    margin:0 0 0 auto;
}
.btn02{
    display: block;
    width: 440px;
    margin: auto;
    padding: 12px 0;
    background-color: #141414;
    color:#fff;
    font-weight: 700;
    text-transform: uppercase;
}
.btn03{
    display: block;
    padding: 6px 0;
    background-color: #141414;
    color:#fff;
    font-weight: bold;
    letter-spacing: 0.2em;
    text-transform: uppercase;
}
.btn03::after{
    position: relative;
    left:16px;
    content:"\f105";
    font-family: FontAwesome;
}
.btn04{
    display: block;
    width: 250px;
    padding: 20px 0;
    background-color: #141414;
    color:#fff;
    font-weight: 700;
    line-height: 1;
    text-transform: uppercase;
    margin-bottom: 24px;
}
.btn04::after{
    position: relative;
    left:16px;
    content:"\f105";
    font-family: FontAwesome;
}
.btn05{
    display: block;
    width: 100%;
    max-width: 1080px;
/*    margin: auto 0;*/
    padding:12px 0;
    background-color: #141414;
    color:#fff;
    font-size: 3.2rem;
    font-weight: 600;
    letter-spacing:0.15em;
    text-transform: uppercase;
}
.btn05::after{
    position: relative;
    left:48px;
    content:"\f105";
    font-family: FontAwesome;
}
.btn-submit{
    -webkit-appearance:none;
    appearance:none;
    display: block;
    width: 234px;
    border:none;
    padding: 12px 0;
    background-color: #141414;
    color:#fff;
    font-size: 1.8rem;
    font-weight: bold;
    letter-spacing: 0.5em;
    margin: 0 auto;
    cursor: pointer;
    transition: all 0.2s;
}
.btn-submit:hover{
    opacity: 0.5;
}

/*------------------------------
 *BG-GRAY
--------------------------------*/
.bg-base__lightgray{
    background-color: #F1F1F1;
}
.bg-base__gray{
    background-color: rgba(67,67,67,0.50);
}
.bg-gray{
    position:absolute;
    z-index: -50;
    top:0;
    left:0;
    width: 75.2%;
    height: 1178px;
    background-color: #434343;
}
.bg-gray02{
    position:absolute;
    z-index: -1;
    top: 900px;
    right: 0;
    width: 65%;
    height: 412px;
    background-color: #F1F1F1;
}
.bg-gray04{
    position:absolute;
    z-index: -1;
    top:0;
    right:0;
    width: 65%;
    height: 500px;
    background-color: #F1F1F1;
}
.bg-gray05{
    position:absolute;
    z-index: -1;
    top: 0;
    right: 0;
    width: 1000px;
    height: 300px;
    background-color: #F1F1F1;
}
.bg-gray_L{
    position: absolute;
    z-index: -1;
    top: 0;
    left: 0;
    width: 75%;
    height: 354px;
    background:#F1F1F1;
}
.bg-gray_R{
    position: absolute;
    z-index: -1;
    top: 0;
    right: 0;
    width: 75%;
    height: 354px;
    background:#F1F1F1;
}
.base__thumb_L{
    position: absolute;
    z-index: -1;
    top: 90px;
    left: -90px;
    width: 320px;
    height: 360px;
    background:#F1F1F1;
}
.base__thumb_R{
    position: absolute;
    z-index: -1;
    top: 90px;
    right: -90px;
    width: 320px;
    height: 360px;
    background:#F1F1F1;
}
.base__thumb_L-02{
    position: absolute;
    z-index: -1;
    top: 90px;
    left: -90px;
    width: 320px;
    height: 364px;
    background:#F1F1F1;
}
.base__thumb_R-02{
    position: absolute;
    z-index: -1;
    top: 90px;
    right: -90px;
    width: 320px;
    height: 364px;
    background:#F1F1F1;
}
.base__thumb_L-03{
    position: absolute;
    z-index: -1;
    top: 90px;
    left: -90px;
    width: 418px;
    height: 419px;
    background:#F1F1F1;
}
.base__thumb_R-03{
    position: absolute;
    z-index: -1;
    top: 90px;
    right: -90px;
    width: 418px;
    height: 419px;
    background:#F1F1F1;
}
.base__thumb_L-04{
	display: none;
}
.base__thumb_R-04{
	display: none;
}
.img-01{
	flex-shrink: 0;
	width: 320px;
    height: 360px;
	position: relative;
}
.img-01-01{
	flex-shrink: 0;
	width: 320px;
    height: 360px;
	position: relative;
}
.img-02{
	flex-shrink: 0;
	width: 320px;
    height: 360px;
	position: relative;
}
.img-02-02{
	flex-shrink: 0;
	width: 320px;
    height: 360px;
	position: relative;
}
.img-03{
	flex-shrink: 0;
	width: 402px;
    height: 430px;
	position: relative;
}
.img-04{
	flex-shrink: 0;
	width: 402px;
    height: 430px;
	position: relative;
}
.img-05{
	flex-shrink: 0;
	width: 418px;
    height: 419px;
	position: relative;
}
.img-06{
	flex-shrink: 0;
	width: 418px;
    height: 419px;
	position: relative;
}
.img-07{
	flex-shrink: 0;
/*	width: 290px;
    height: 290px;*/
	position: relative;
}
.img-08{
	flex-shrink: 0;
/*	width: 290px;
    height: 290px;*/
	position: relative;
}
.thumb-img{
    display: inline-block;
    width: 100%;
    height: auto;
    margin-bottom: 90px;
}

/*------------------------------
 *parallax
--------------------------------*/
.parallax-L01{
    position: absolute;
    z-index: 0;
    top: 200px;
    left: 0;
}
.parallax-R01{
    position: absolute;
    z-index: 0;
    top: 150px;
    right: 0;
}
.parallax-L02{
    position: absolute;
    z-index: 0;
    top: 150px;
    left: 0;
}
.parallax-R02{
    position: absolute;
    z-index: 0;
    top: 100px;
    right: 0;
}
.parallax-L03{
    position: absolute;
    z-index: 0;
    top: 70px;
    left: 0;
}
.parallax-R03{
    position: absolute;
    z-index: 0;
    top: 50px;
    right: 0;
}
.parallax-04{
    position: absolute;
    z-index: 0;
    top: 450px;
    right: 0;
}
/*------------------------------
 *フェードイン用のCSS
--------------------------------*/
.slide-bottom2 {
   opacity: 0;
   transform: translateY(20px);
   transition: all 0.5s 0.3s ease-out;
 }
.slide-bottom {
   opacity: 0;
   transform: translateY(20px);
   transition: all 1.0s 0.5s ease-out;
 }
.slide-bottom3 {
   opacity: 0;
   transform: translateY(20px);
   transition: all 1.3s 0s ease-out;
 }
.slide-bottom4 {
   opacity: 0;
   transform: translateY(40px);
   transition: all 1.5s 0s ease-out;
 }
.slide-bottom5 {
   opacity: 0;
   transform: translateY(60px);
   transition: all 1.7s 0s ease-out;
 }

/*------------------------------
 *marker-anim
--------------------------------*/
.marker-animation{
    font-size: 1.9rem;
    font-weight: 700;
    position: relative;
    z-index: 1;
}
.marker-animation:after{
    content: "";
    position: absolute;
    left: 0;
    bottom: -10px;
    width: 0%;
    height: 4px;
    background: #C5B8A0;
    z-index: -1;
    transition: all 0.8s;
}
.marker-animation.active:after{
    width: 100%;
}
.marker-animation-02{
    font-size: 3.1rem;
    font-weight: 700;
    letter-spacing: 0.15em;
    text-transform: uppercase;
    position: relative;
    z-index: 1;
}
.marker-animation-02:after{
    content: "";
    position: absolute;
    left: 0;
    bottom: -40px;
    width: 0%;
    height: 4px;
    background: #C5B8A0;
    z-index: -1;
    transition: all 1s;
}
.marker-animation-02.active:after{
    width: 100%;
}
.marker-animation-03{
    position: relative;
    z-index: 1;
}
.marker-animation-03:after{
    content: "";
    position: absolute;
    left: 0;
    bottom: -40px;
    width: 0%;
    height: 4px;
    background: #C5B8A0;
    z-index: -1;
    transition: all 1s;
}
.marker-animation-03.active:after{
    width: 100%;
}
.marker-animation-04{
    position: relative;
    z-index: 1;
}
.marker-animation-04:after{
    content: "";
    position: absolute;
    left: 0;
    bottom: -40px;
    width: 0%;
    height: 4px;
    background: #C5B8A0;
    z-index: -1;
    transition: all 1s;
}
.marker-animation-04.active:after{
    width: 100%;
}

/*------------------------------
 *pictgram
--------------------------------*/
.pict-list{
    display:flex;
    flex-wrap: wrap;
}
.pict-item{
    display: block;
    width: 33%;
    border: 0.25px solid;
    border-color:rgba(159,159,159,0.5);
}
.pict-item:first-of-type{
    border-bottom: transparent; 
}
.pict-item:nth-of-type(2){
    border-right: transparent; 
    border-left: transparent; 
}
.pictgram{
    width: 22rem;
    height: 22rem;
    padding: 60px 0;
}
.pict-title{
    font-size: 1.8rem;
    font-weight: 600;
    padding: 0 10px 40px;
}
.pict-sentence{
    text-align: left;
    padding: 0 30px 60px;
}

/*------------------------------
 *hero-image
--------------------------------*/
.hero-image{
    position: relative;
    width: 100%;
    height: 100vh;
    overflow: hidden;
/*  background-image:url("../images/top/hero_pc.jpg");
    background-position: center center;
    background-repeat: no-repeat;
    background-size: cover;*/
}
video {
  position: absolute;
  top: 50%;
  left: 50%;
  transform: translate3d(-50%,-50%,0);
  width: auto;
  height: auto;
  min-width: 100%;
  min-height: 100%;
  background: url("../images/top/hero_pc.jpg") no-repeat;
  background-position: center center;
  background-size: cover;
  z-index: -1;
}
.hero-image-02{
    position: relative;
    margin-top: 154px;
}
.hero-image-03{
    position: relative;
    margin-top: 154px;
    margin-bottom: 136px;
}
.title-img{
    position: absolute;
    right: 0;
    z-index: -10;
    height: 300px;
}
.title-img02{
    position: absolute;
    right: 0;
    z-index: -10;
    height: 309px;
}
.FC{
    position: absolute;
    right: 40px;
    bottom: 40px;
    width: 170px;
    height: 60px;
    z-index: 50;
}
.FC-recruitment{
    position: absolute;
    z-index: 60;
    font-size: 1.6rem;
    font-weight: 700;
    line-height: 60px;
    padding-left: 22px;
}
.bg-gray03{
    position: relative;
    z-index:50;
    width: 32px;
    height: 60px;
    background-color: #F1F1F1;
    transition: all 0.5s;
}
.FC:hover .bg-gray03{
    width: 170px;
}

/*------------------------------
 *NEXT
--------------------------------*/
.next-message,.next-message-02{
    font-size: 2.2rem;
    font-weight: 700;
    letter-spacing: 0.1em;
    padding-bottom: 24px;
}
.next-message-02{
    padding-top: 64px;
}

/*------------------------------
 *VISION
--------------------------------*/
/*top*/
.message{
    font-size: 1.9rem;
    font-weight: 700;
    line-height: 2.5;
}
.message-sentence{
    margin-bottom: 80px;
    width: 740px;
}
.message-02{
    padding-left: 220px;
}
.message-04{
    padding-left: 220px;
}
.message-area{
    position: relative;
}
.profile__area{
    display: flex;
    flex-direction: row-reverse;
    justify-content: flex-start;
    align-items: flex-end;
}
.message-profile{
    padding-right: 80px;
}
.message-BG{
    background-image: url("../images/vision/img_vision_BG_pc.jpg");
    background-size: cover;
}
.ookubo_vision_thumb{
    width: 191px;
}
.text-what{
    font-size: 1.9rem;
    font-weight: 500;
    line-height: 2.5;
}

/*------------------------------
 *ALL-INCLUSIVE SALON
--------------------------------*/
/*top*/
.ais-overview{
    width: 42%;
    font-weight: 500;
    line-height: 3;
}
.ais{
    position: relative;
}
.ais__thumb{
    position: absolute;
    right:0;
    top: 31.5%;
    width:40vw;    
}

/*COURSE*/
.menu-list{
    display: flex;
    flex-wrap: wrap;
    margin-left: -30px;
}
.menu-item{
    width: 46.9%;
    height: auto;
    margin: 0 0 80px 30px;
}
.menu-title{
    display: flex;
    justify-content: space-between;
    background-color: #E8E5DF;
    padding: 20px 24px;
}
.menu-title>p{
    font-size: 2rem;
    font-weight: 600;
    line-height: 1;
    text-transform: uppercase;
}
.menu-sentence{
    font-weight:500;
    padding-top: 16px;
}
.menu-graph{
    padding-top: 40px;
}
.menu-link{
    padding-top: 60px;
    font-size: 1.6rem;
    font-weight: 600;
    line-height: 1;
}
.under{
    font-size: 1.6rem;
    font-weight: 600;
    border-bottom: solid 4px #C5B8A0;
}

/*SERVICE FLOW*/
.sf-list{
    display: flex;
    margin-left: -24px;
}
.sf-item{
    width: 18%;
    height: auto;
    margin-left: 24px;
}
.circle{
    position: relative;
    height:110px;
    width:110px;
    border-radius:50%;
    line-height:110px;
    text-align:center;
    background: #C5B8A0;
    font-size: 3.2rem;
    color: #fff;
    margin: 0 auto;
}
.circle>span{
    font-weight: 600;
}
.circle:before{
    position: absolute;
    top: 0;
    right: -48%;
    bottom: 0;
    width: 0;
    height: 0;
    margin: auto;
    content: 'f0da';
    border-width: 9px 0 9px 9px;
    border-style: solid;
    border-color: transparent transparent transparent #141414;
}
.sf-item:last-of-type .circle:before{
  display:none;
}
.sf-title{
    font-size: 1.4rem;
    letter-spacing: 0.05em;
    line-height: 1.6;
    font-weight:600;
    padding-top: 30px;
}
.sf-sentence{
    text-align: left;
    letter-spacing: 0.1em;
    line-height: 1.8;
    padding-top: 16px;
}
/*BENEFIT*/
.benefit-list{
    display: flex;
    justify-content: space-between;
    margin-bottom: 120px;
}
.benefit-list:last-of-type{
    margin-bottom: 55px;
}
.benefit-list02{
    display: flex;
    flex-direction: row-reverse;
    justify-content: space-between;
    margin-bottom: 160px;
}
.benefit-sentence{
    width: 350px;
    font-weight: 500;
}

/*SALES RESULTS*/
.sr-title{
    font-size: 2rem;
    font-weight: 700;
    line-height: 1;
    margin-bottom: 40px;
}
.sr-title>p{
	font-weight: 700;
}
.sr-sentence{
    margin-bottom: 60px;
}

/*------------------------------
 *VOICE
--------------------------------*/
/*top*/
.voice01-list{
    display: flex;
    flex-direction: row-reverse;
    justify-content: space-between;
}
.voice01-item{
    position: relative;
    z-index: 10;
    width: 320px;
    background-color: #fff;
}
.voice01-item__contents{
    padding: 50px;
}
.voice01-text{
    font-size: 1.3rem;
    font-weight: 600;
    line-height: 2;
    padding-bottom: 30px;
    text-align: left;
}
.voice-item__name{
    font-size: 2rem;
    font-weight: bold;
    padding-bottom: 20px;
}
.voice-number-0{
    position: absolute;
    z-index: 0;
    font-size: 10.6rem;
    font-weight:600;
    line-height: 0;
    transform: translate3d(-35px,0,0);
}
.voice-number-number{
    position: absolute;
    z-index: 50;
    font-size: 10.6rem;
    font-weight:600;	
    line-height: 0;
    transform: translate3d(45px,0,0);
}
.voice01-01{
    position:relative;
    transform: translateY(-209px);
}
.voice01-02{
    position:relative;
    transform: translateY(170px);
}
.voice02-list{
    display: flex;
    flex-direction: row-reverse;
    justify-content: space-between;
}
.voice02-item{
    position: relative;
    z-index: 10;
    width: 320px;
    background-color: #fff;
}
.voice02-item__contents{
    padding: 15px 60px;
}
.voice-number-0-wh{
    position: absolute;
    z-index: 0;
    font-size: 10.6rem;
    font-weight:600;
    line-height: 0;
    transform: translate3d(-35px,0,0);
    color: #fff;
}
.voice-number-number-wh{
    position: absolute;
    z-index: 50;
    font-size: 10.6rem;
    font-weight:600;	
    line-height: 0;
    transform: translate3d(45px,0,0);
    color: #fff;
}
.voice02-01{
    position: relative;
    transform: translateY(-113px);
}
.voice02-02{
    position: relative;
    transform: translateY(270px);
}
.voice-item__name02{
    font-size: 2rem;
    font-weight: bold;
}
.voice02__name_en{
    font-size: 0.9rem;
    font-weight: bold;
    letter-spacing: 0.05em;
}
.width100{
    width: 100%;
    position: relative;
}

/*voice01*/
.voice-item{
    position: relative;
    margin-bottom: 128px;
}
.voice-item:last-of-type{
    position: relative;
    margin-bottom: 0;
}
.voice-title{
    font-size: 1.8rem;
    font-weight: 600;
    line-height: 1;
    margin-bottom: 40px;
}
.voice-name{
    font-size: 1.6rem;
    font-weight: 500;
    line-height: 1;
    margin-bottom: 40px;
}
.voice-sentence{
    font-weight: 500;
    width: 85%;
}
.voice-base{
    padding: 40px 0;
    background-color: #F1F1F1;
}
.voice-base02{
    box-sizing: border-box;
    padding: 40px 0 40px 75px;
    background-color: #F1F1F1;
}
/*voice02*/
.staff-voice-01{
    display: flex;
    margin-bottom: 60px;
	background-color: #fff;
    height: 430px;
}
.staff-voice-02{
    display: flex;
    margin-bottom: 60px;
	background-color: #fff;
    height: 430px;
}
.staff-voice:last-of-type{
    margin-bottom: 0;
}
.voice02-sentence{
    padding: 60px 60px;
}
.staff-name__en{
    font-size: 1.5rem;
	font-weight: 600; 
	text-transform: uppercase;
	padding-bottom: 30px;
}
.staff-name{
    font-size: 2.5rem;
    font-weight: 600;
    line-height: 1;
    padding-bottom: 30px;
}
.staff-address{
    text-align: right;
    font-weight: 500;
    line-height: 1;
    padding-top: 30px;
}

/*------------------------------
 *SERVICE
--------------------------------*/
/*top*/
.service-list{
    display: flex;
    margin-left: -40px;
    position: relative;
}
.service-item{ 
    width: 33.333%;
    margin-left: 40px;
    position: relative;
}
.service-item__title{
    position: absolute;
    top: 0;
    left: 0;
    width: 80px;
    padding: 10px 0;
    background-color:#141414;
    color: #fff;
    font-size: 0.9rem;
    font-weight: 700;
}
.service-text{
    font-weight: 600;
}
.service-item__contents{
    position: relative;
    padding: 40px 0 96px 22px;
}
.service-item__contents::before{
    position: absolute;
    top: 47px;
    left:0;
    width: 3px;
    height: 50px;
    content:"";
    background: #C5B8A0;
}
.service{
    position: relative;
}

/*serviceページ*/
.service-sentence{
    font-size: 1.6rem;
    font-weight: 500;
}
.service-list-02{
    display: flex;
    justify-content: space-between;
    align-items: flex-start;
    position: relative;
	padding-top: 136px;
}
.service-list-02_02{
    display: flex;
    justify-content: space-between;
    flex-direction: row-reverse;
    align-items: flex-start;
    position: relative;
	padding-top: 136px;
}
.service-item-02{
    padding-left: 120px;
}
.service-item-02-02{
    padding-right: 120px;
}
.service-01-sentence{
    margin-bottom: 60px;
}

/*モーダルウィンドウ*/
.modaal-content-container {
    padding: 40px 40px 0;
}
.modaal-close {
    right: 50%;
}

.mb-list{
    display: flex;
    justify-content: space-between;
    align-items: flex-start;
    position: relative;
}
.mb-list02{
    display: flex;
    justify-content: space-between;
    flex-direction: row-reverse;
    align-items: flex-start;
    position: relative;
}
.mb-item{
    padding-left: 40px;
}
.mb-item02{
    padding-right: 40px;
}
.louvredo-sentence{
	padding-bottom: 40px;
}

/*QRコード*/
.QR-sentence01{
    font-size: 1.5rem;
    font-weight: 500;
    padding: 80px 40px 60px;
}
.QR-sentence02{
    font-size: 2.3rem;
    font-weight: 600;
    padding: 0 40px 60px;
}
.QRcode{
    width: 100px;
    padding-bottom: 96px;
    margin: auto;
/*    border: 10px solid #141414;*/
}

/*------------------------------
 *Company
--------------------------------*/
.business-sentence{
    font-size: 2rem;
    font-weight: 600;
    line-height: 3;
}
.info-item{
    display: flex;
    border-bottom: solid 1px #141414;
    padding: 40px 0;
}
.info-title{
    flex: 0 0 70px;
    width: 70px;
    margin-right: 232px;
    font-size: 1.6rem;
    font-weight: 600;
    line-height: 1;
}
.info-detail{
    flex: 1 1 auto;
    font-size: 1.4rem;
    font-weight: 500;
    line-height: 1;
}

/*member*/
.member-list{
    display: flex;
    justify-content:center;
    margin-left:-30px;
}
.member{
    width:33.333%;
    margin:0 0 0 30px;
}
.member-profile{
    padding-top: 30px;
}
.member-job__title{
    font-size: 0.9rem;
    line-height: 1;
}
.member-name{
    font-size: 1.8rem;
    font-weight: 600;
    line-height: 1;
    padding: 16px 0;
}
.member-name__en{
    font-size: 0.9rem;
    text-transform: uppercase;
    font-weight: 500;
    line-height: 1;
    margin-bottom: 30px;
}
.profile-detail{
    font-weight: 500;
    line-height: 2;
}
.profile-detail-02{
    font-weight: 500;
    line-height: 2;
}

/*------------------------------
 *Contact
--------------------------------*/
.contact{
    padding: 96px 96px 0;
}
.form-parts{
    -webkit-appearance:none;
    appearance:none;
    box-sizing: border-box;
    border:solid 1px #d7d7d7;
    background-color: #fff;	
}
.form-parts__text{
    width: 100%;
    padding: 10.5px 8px;
    color:#141414;
    font-size: 1.5rem;
}
.form-item{
    display: flex;
    margin-bottom: 36px;
}
.form-item:last-of-type{
    margin-bottom: 72px;
}
.form-title{
    width: 170px;
    margin: 0 90px 0 0;
    padding: 10px 0;
    font-weight: 600;
    letter-spacing: 0.05em;
    line-height: 1;
}
.form-detail{
    width: 600px;
}
.caution{
    display: inline;
    width: 30px;
    margin-left: 10px;
    padding: 5px 5px;
    background-color: #C6C6C6;
    color:#141414;
    font-size: 1rem;
    font-weight: 600;
    line-height: 1;
    text-align: center;
    vertical-align: middle;
}

@media screen and (max-width:1140px){
  /*------------------------------
   *utility
  --------------------------------*/
  .header-inner{
	  box-sizing: border-box;
  }
  .wrapper-1140{
	  box-sizing: border-box;
      padding-right: 16px;
      padding-left: 16px;
  }
  .wrapper-1020{
	  box-sizing: border-box;
      padding-right: 32px;
      padding-left: 32px;
  }
  /*------------------------------
   *footer
  --------------------------------*/
  .footer{
      position: relative;
      padding-top:75px;
  }
  .footer-nav{
      flex-direction: column;
  }
  .footer-nav-list{
      justify-content: center;
  }
  .footer-nav-list-01{
      padding-left: 0;
  }
  .footer-nav-list-02{
      padding-left: 120px;
  }
  .copyrights{
      display: flex;
      justify-content: center;
  }
  .copy{
      position: static;
      top: 270px;
      transform: rotate(0);
  }
  .rights{
      position: static;
      top: 270px;
	  margin-left: 40px;
      transform: rotate(0);
  }

  /*------------------------------
   *logo
  --------------------------------*/
  .footer-logo{
      margin: 0 auto;
      margin-bottom: 75px;
  }
	
  /*------------------------------
   *service
  --------------------------------*/
  /*モーダルウィンドウ*/ 
  .modaal-container{
      width: 80%;
  }
  .modaal-content-container {
	  box-sizing: border-box;
      padding: 0 32px;
  }
  .louvredo-sentence{
      padding: 40px 0;
  }

} 
@media screen and (max-width:1000px){
  /*------------------------------
   *utility
  --------------------------------*/
  .wrapper-960{
	  box-sizing: border-box;
      padding-right: 32px;
      padding-left: 32px;
  }

  /*------------------------------
   *section
  --------------------------------*/
  .section-header03{
      padding: 100px 0 88px; 
  }
  .section-header05 {
      padding: 100px 0 60px;
  }
  /*------------------------------
   *global-navigation
  --------------------------------*/
  .header-navigation{
      display: none;
  }
  /*------------------------------
   *hero-image
  --------------------------------*/
  .title-img{
      position: absolute;
      right: 0;
      z-index: -10;
      height: 30vw;
  }
  .title-img02{
      position: absolute;
      right: 0;
      z-index: -10;
      height: 30vw;
  }
  /*------------------------------
   *VISION
  --------------------------------*/
  .message-02{
      padding-left: 0;
	  margin-left: auto;
      margin-right: 0px;
  }
  .message-04{
      padding-left: 0;
	  margin-left: auto;
      margin-right: 0px;
  }
  /*------------------------------
   *ALL-INCLUSIVE SALON
  --------------------------------*/
  /*COURSE*/
  .menu-list{
      margin: 0 auto;
  }
  .menu-item{
      width: 44%;
  }
  /*------------------------------
   *service
  --------------------------------*/    
  .service-item-02{
      padding-left: 10vw;
  }
  .service-item-02-02{
      padding-right: 10vw;
  }
    
}

@media screen and (max-width:960px){
  /*------------------------------
   *utility
  --------------------------------*/
  .wrapper-810{
	  box-sizing: border-box;
      padding-right: 32px;
      padding-left: 32px;
  }
  .br-pc{
      display: block;
  }
  .br-tb{
      display: block;
  }
  .br-sp{
      display: none;
  }
  .img-pc{
      display: block;
  }
  .img-tb{
      display: block;
  }
  .img-sp{
      display: none;
  }

  /*------------------------------
   *BG-GRAY
  --------------------------------*/
  .bg-base__gray{
      background-color: rgba(67,67,67,0.30);
	  z-index: -50;
  }
  .base__thumb_L{
      top: 90px;
      left: -90px;
      width: 40vw;
      height: 45vw;
  }
  .base__thumb_R{
      top: 90px;
      right: -90px;
      width: 40vw;
      height: 45vw;
  }
  .base__thumb_L-03{
      top: 90px;
      left: -90px;
      width: 40vw;
      height: 40vw;
  }
  .base__thumb_R-03{
      top: 90px;
      right: -90px;
      width: 40vw;
      height: 40vw;
  }

  .img-01{
      width: 40vw;
      height: 45vw;
  }
  .img-02{
      width: 40vw;
      height: 45vw;
  }
  .img-01-01{
      width: 24vw;
      height: 27vw;
  }
  .img-02-02{
      width: 24vw;
      height: 27vw;
  }
  .img-05{
      width: 40vw;
      height: 40vw;
  }
  .img-06{
      width: 40vw;
      height: 40vw;
  }

  /*------------------------------
   *VISION
  --------------------------------*/
  /*top*/
  .message-sentence{
      margin-bottom: 60px;
      width: 100%;
  }
  /*------------------------------
   *ALL-INCLUSIVE SALON
  --------------------------------*/
  /*SERVICE FLOW*/
  .sf-list{
      display: block;
      margin-left: 0;
      margin: 0 auto;
      text-align: center;
      transform: translateY(-27.5px);
      margin-bottom: -27.5px;
  }
  .sf-item{
      width: 85%;
      height: auto;
      margin-left: 0;
      text-align: left;
      display: inline-block;
  }
  .circle{
      display: block;
      position: relative;
      height: 55px;
      width: 55px;
      border-radius:50%;
      line-height:55px;
      font-size: 1.6rem;
      transform: translateY(27.5px);
  }
  .circle:before{
      display:none;
  }
  .sf-title{
      font-size: 1.5rem;
      padding-top: 30px;
  }
  .sf-title-04{
      padding-bottom: 30px;
  }
  .sf-base{
      background-color:#F1F1F1;
      margin: 0 auto;
      text-align: center;
      display: block;
  }
  .sf-sentence{
      text-align: left;
      display: inline-block;
      line-height: 1.8;
      padding: 30px 20px 56px;
  }
  /*BENEFIT*/
  .benefit-sentence{
      width: 40vw;
  }
  /*SALES RESULTS*/
  .sr-title{
      line-height: 2;
  } 
    
  /*------------------------------
   *voice
  --------------------------------*/
  /*voice02*/
  .staff-voice-01{
      flex-direction: column;
      margin-bottom: 0;
	  background-color: rgba(255,255,255,0.00);
      height: auto;
  }
  .staff-voice-02{
      flex-direction: column;
      margin-bottom: 0;
	  background-color: rgba(255,255,255,0.00);
      height: auto;
  }
  .voice02-sentence{
      padding: 50px 0;
  }
  .voice02-sentence-sp{
      padding-bottom: 0;
  }
  .staff-name__en{
      font-size: 1.3rem;
	  letter-spacing: 0.1em;
      line-height: 1;
  }
  .staff-name{
      font-size: 1.8rem;
      padding-bottom: 30px;
  }
  .staff-address{
      font-size: 1.3rem;
	  letter-spacing: 0.05em;
      line-height: 1;
      padding-top: 30px;
  }
    
  /*------------------------------
   *service
  --------------------------------*/ 
  .service-item-02{
      width: 40vw;
      padding-left: 6vw;
  }
  .service-item-02-02{
      padding-right: 6vw;
  }
  /*モーダルウィンドウ*/
  .modaal-container{
      width: 100%;
  }
  .mb-item{
      padding-left: 4vw;
  }
  .mb-item02{
      padding-left: 4vw;
  } 
  /*------------------------------
   *company
  --------------------------------*/
  .info-detail{
      line-height: 1.5;
  }
  /*------------------------------
   *Contact
  --------------------------------*/
  .form-title{
      width: 240px;
      margin: 0 20px 0 0;
  }

}

@media screen and (max-width:765px){
  /*------------------------------
   *pictgram
  --------------------------------*/
  .pict-item{
      width: 49%;
  }
  .pict-item:nth-of-type(2){
      border-right: 0.25px solid;
      border-color:rgba(159,159,159,0.5);
  }
  .pict-item:nth-of-type(4){
      border-top: transparent;
      border-left: transparent; 
  }
	 
  /*------------------------------
   *VISION
  --------------------------------*/
  /*top*/
  .message{
      text-align: left;
  }
  .profile__area{
      display: block;
      text-align: center;
  }
  .message-profile{
      padding-right: 0;
  }
  .ookubo_vision_thumb{
      margin-bottom: 50px;
  }
  /*------------------------------
   *ALL-INCLUSIVE SALON
  --------------------------------*/
  /*top*/
  .ais-overview{
      width: 42%;
      line-height: 2.5;
  }
  .ais__thumb{
      right:0;
      top: 31.5%;
      width:40vw;
  }
    
  /*------------------------------
   *voice
  --------------------------------*/
  /*voice01*/
  .voice-title{
      line-height: 2;
  }
  /*------------------------------
   *SERVICE
  --------------------------------*/
  /*top*/
  .service-list{
      margin-left: -20px;
  }
  .service-item{
      margin-left: 20px;
  }
  .service-item__title{
      width: 40%;
      padding: 10px 0;
      font-size: 0.9rem;
  }
  .service-item__contents{
      padding: 40px 0 96px 22px;
  }
  .service-item__contents::before{
      top: 47px;
      left:0;
      width: 3px;
      height: 50px;
  }

  .service-item-02{
      padding-left: 4vw;
  }
  .service-item-02-02{
      padding-right: 4vw;
  }
  /*モーダルウィンドウ*/
  .mb-item{
      padding-left: 4vw;
  }
  .mb-item02{
      padding-left: 4vw;
  } 
}

@media screen and (max-width:640px){
  /*------------------------------
   *utility
  --------------------------------*/
  .img-pc{
      display: none;
  }
  .img-tb{
      display: block;
  }
  .img-sp{
      display: block;
  }
  .br-pc{
      display: none;
  }
  .br-tb{
      display: block;
  }
  .br-sp{
      display: block;
  }
	
  .header-inner{
      padding: 0 16px;
  }
   .wrapper-1140{
      width: 100%;
      padding: 0 16px;
  }
  .wrapper-1020{
      width: 100%;
      padding: 0 32px;
  }
  .wrapper-960{
      width: 100%;
      padding: 0 32px;
  }
  .wrapper-810{
      width: 100%;
      padding: 0 0;
  }
  .text-left{
      text-align: left !important;
      margin-left: 16px !important;
  }
  .text-left-02{
      text-align: left !important;
  }
  .pb-0{
      padding-bottom: 0 !important;
  }
  /*------------------------------
   *section
  --------------------------------*/
  .section-header{
      padding: 75px 0 50px;
  }
  .section-header02{
      padding: 50px 0 30px;
  }
  .section-header03{
      padding: 75px 0 55px; 
  }
  .section-header04{
      padding:75px  0 50px;
  }
  .section-header05{
      padding: 75px 0 50px;
  }
  .width100 .section-header05{
      padding: 262px 0 50px;
  }
  .section-header06{
     padding-left: 0;
  }
  .section-header07{
      padding: 75px 0 50px;
  }
  .section-header08{
      padding-top: 50px;
	  padding-left: 0;
  }
  .section-header09{
      padding: 75px 0 50px;
  }
  .section-subheader{
      padding: 50px 0 50px;
  }
  .section-subheader02{
      padding: 50px 0 50px;
  }
  .width100 .section-subheader02{
      padding: 50px 0 115px;
  }
  .section-subheader03{
      padding-bottom: 50px;
  }
  .section-body{
      padding-bottom: 50px;
  }
  .section-body02{
      padding-bottom: 330px;
  }
  .section-body02-02{
      padding-bottom: 75px;
  }
  .section-body02-03{
      padding-bottom: 75px;
  }
  .section-body03{
      padding-bottom: 75px;
  }
  .section-body04{
      padding-bottom: 50px;
  }
  .section-body05{
	  padding-bottom: 75px;
  }
  .section-footer{
      padding-bottom: 75px;
  }
  .section-footer02{
      padding-bottom: 75px;
  }
    
  /*------------------------------
   *ページ内リンク用（ヘッダーに重ならい為）
  --------------------------------*/
  .cc .section-header{
      padding: 0 0 50px;
  }
  .cc h2{
      padding-top: 75px;
  }
  .sf .section-header{
      padding: 0 0 50px;
  }
  .sf h2{
      padding-top: 75px;
  }
  .bf .section-header{
      padding: 0 0 50px;
  }
  .bf h2{
      padding-top: 75px;
  }
  .sr .section-header{
      padding: 0 0 50px;
  }
  .sr h2{
      padding-top: 75px;
  }

  /*------------------------------
   *title
  --------------------------------*/
  .section-title__hero{
      font-size: 3rem;
      margin-left: 16px;
  }
  .section-title{
      font-size: 2.9rem;
      text-align: center;
  }
  .section-title01{
      font-size: 3rem;
      letter-spacing: 0.18em;
      line-height: 1.5;
      padding-top: 30px;
      margin-left: 16px;
  }
  .section-title02{
      font-size: 2.9rem;
      line-height: 2;
  }
  .section-title03{
	  position: absolute;
	  z-index: 1;
      font-size: 2.4rem;
  }
  .section-title03-02{
      font-size: 2.4rem;
  }
  .section-title04{
      font-size: 2.9rem;
      letter-spacing: 0.05em;
  }
  .section-title05{
      font-size: 2.9rem;
      text-align: center;
  }
  .section-subtitle{
      font-size: 1.7rem;
      letter-spacing: 0.05em;
      text-align: center;
      padding-top: 30px;
  }
  .section-subtitle03{
      font-size: 1.6rem;
      padding-top: 30px;
  }
  .section-subtitle03-02{
      font-size: 1.6rem;
      padding-top: 30px;
  }
  .section-subtitle04{
      font-size: 2rem;
      padding-top: 30px;
      letter-spacing: 0.1em;
  }
  .section-subsubtitle{
      font-size: 1.6rem;
      padding: 30px 0 0 20px;
  }
  .section-subsubtitle::before{
      position: absolute;
      top: 37px;
      left:0;
      width: 3px;
      height: 50px;
  }
  .section-subsubtitle02{
      font-size: 1.6rem;
      letter-spacing: 0.05em;
      padding: 30px 0 0 20px;
  }
  .section-subsubtitle02::before{
      position: absolute;
      top: 20px;
      left:0;
      width: 3px;
      height: 50px;
  }
  .title-single{
      line-height: 1;
      text-align: center;
  }
	
  /*------------------------------
   *header
  --------------------------------*/
  .header{
      position: fixed;
      top: 0;
      left: 0;
      z-index: 1000;
      width: 100%;
      height: 0;
  }
  .header-inner{
      position: relative;
      top: 24px;
      display: flex;
      justify-content: space-between;
      align-items: center;
      width: 100%;
      height: auto;
  }

  /*------------------------------
   *navigation-humberger
  --------------------------------*/
  .navigation{
      position: fixed;
      box-sizing: border-box;
      padding: 0 32px;
  }
  .nav-list{
      margin-top:-36px;
      width: 100%;
      margin:92px auto;
  }
  .nav-item{
      line-height: 1;
      margin-top: 36px;
  }
  .nav-item>a{
      font-size: 2.4rem;
      line-height: 1;
  }
  .ais-list{
      display: flex;
      flex-wrap: wrap;
      width: 80%;
  }
  .ais-item{
      line-height: 1;
      margin: 20px 0 0 15px;
  }
  .ais-item:first-of-type{
      margin-left: 0;
  }
  .ais-item:nth-of-type(3){
      margin-left: 0;
  }
  .ais-item>a{
      font-size: 1rem;
      letter-spacing: 0.1em;
      line-height: 1;
  }

  /*------------------------------
   *footer
  --------------------------------*/
  .footer-nav{
      padding-bottom: 75px;
  }
  .footer-nav-item>a{
      letter-spacing: 0.05em;
  }
  .footer-ais-item>a{
      font-size: 0.9rem;
      letter-spacing: 0.05em;
  }
  .footer-nav-item{
      line-height: 1.5;
      margin-bottom: 24px;
  }
  .footer-ais-item{
      line-height: 1.5;
      margin-bottom: 24px;
  }
  .footer-ais-item:first-of-type{
      padding-top: 24px;
  }
  .footer-nav-list{
      justify-content: space-between;
  }
  .footer-nav-list-02{
      padding-left: 0;
  }
  .copyrights{
      justify-content: space-between;
  }
  .copy{
      position: static;
      top: 270px;
      margin-left: 32px;
      letter-spacing: 0.05em;
  }
  .rights{
	  margin-left: 0;
      margin-right: 32px;
      letter-spacing: 0.05em;
  }
  .btn-pageTop{
      display: none;
  }

  /*------------------------------
   *logo
  --------------------------------*/
  .logo{
      width: 40%;
  }
  .footer-logo{
      width: 134px;
	  margin-bottom: 30px;
  }
  
  /*------------------------------
   *btn
  --------------------------------*/	
  .btn{
	  width: 100%;
      margin: 0 auto;
      padding: 8px 0;
      letter-spacing: 0.2em;
  }
  .btn::after{
      left:16px;
  }
  .btn02{
      width: 100%;
      padding: 12px 0;
      font-size: 1rem;
      font-weight: 700;
  }
  .btn03{
      padding: 6px 0;
      letter-spacing: 0.2em;
  }
  .btn03::after{
      left:16px;
  }
  .btn04{
      width: 100%;
      padding: 16px 0;
      margin-bottom: 20px;
	  font-size: 1.2rem;
  }
  .btn05{
      width: 100%;
      padding: 12px 0;
      font-size: 1.3rem;
      font-weight: 700;
      letter-spacing: 0.2em;
  }
    
  /*------------------------------
   *BG-GRAY
  --------------------------------*/
  .bg-gray{
      width: 50%;
      height: 1213px;
  }
  .bg-gray02{
      top: 663px;
      width: 100%;
      height: 1206px;
      background-color: #F1F1F1;
  }
  .bg-gray04{
      display: none;
  }
  .bg-gray05{
      top: 0;
      right: 0;
      width: 300px;
      height: 174px;
  }
	
  .base__thumb_L_sp{
      display: none;
  }
  .base__thumb_R_sp{
      display: none;
  }
  .base__thumb_L-02_sp{
      display: none;
  }
  .base__thumb_R-02_sp{
      display: none;
  }
  .base__thumb_L{
      top: 66px;
      left: 50px;
      width: 212.5px;
      height: 238px;
  }
  .base__thumb_R{
      top: 66px;
      right: 50px;
      width: 212.5px;
      height: 238px;
  }
  .base__thumb_L-03{
      top: 66px;
      left: 50px;
      width: 212.5px;
      height: 238px;
  }
  .base__thumb_R-03{
      top: 66px;
      right: 50px;
      width: 212.5px;
      height: 238px;
  }
  .base__thumb_L-04{
	  display: block;
      position: absolute;
      z-index: 0;
      top: 66px;
      left: 50px;
      width: 212.5px;
      height: 238px;
      background:#F1F1F1;
  }
  .base__thumb_R-04{
	  display: block;
      position: absolute;
      z-index: 0;
      top: 66px;
      right: 50px;
      width: 212.5px;
      height: 238px;
      background:#F1F1F1;
  }
  .base__thumb_L-05{
      position: absolute;
      z-index: -1;
      top: 66px;
      left: 50px;
      width: 212.5px;
      height: 238px;
      background-color: #9F9F9F;
  }
  .base__thumb_R-05{
      position: absolute;
      z-index: -1;
      top: 66px;
      right: 50px;
      width: 212.5px;
      height: 238px;
      background-color: #9F9F9F;
  }
    
  .img-01{
      box-sizing: border-box;
      width: 212.5px;
      height: 238px;
  }
  .img-01-01{
      box-sizing: border-box;
      width: 212.5px;
      height: 238px;
  }
  .img-02{
      box-sizing: border-box;
      width: 212.5px;
      height: 238px;
	  margin-left: auto;
  }
  .img-02-02{
      box-sizing: border-box;
      width: 212.5px;
      height: 238px;
	  margin-left: auto;
  }
  .img-03{
      box-sizing: border-box;
      width: 212.5px;
      height: 238px;
  }
  .img-04{
      box-sizing: border-box;
      width: 212.5px;
      height: 238px;
	  margin-left: auto;
  }  
  .img-05{
      box-sizing: border-box;
      width: 212.5px;
      height: 238px;
  }
  .img-06{
      box-sizing: border-box;
      width: 212.5px;
      height: 238px;
	  margin-left: auto;
  }
  .img-07{
      box-sizing: border-box;
      width: 212.5px;
      height: 238px;
  }
  .img-08{
      box-sizing: border-box;
      width: 212.5px;
      height: 238px;
	  margin-left: auto;
  }
    
  /*------------------------------
   *marker-anim
  --------------------------------*/
  .marker-animation{
      font-size: 1.5rem;
      font-weight: 600;
      border-bottom: solid 3px #C5B8A0;
  }
  .marker-animation-02{
      font-size: 2rem;
      letter-spacing: 0.1em;
  }
  .marker-animation-02:after{
      left: 90px;
      bottom: -20px;
  }
  .marker-animation-02.active:after{
      width: 20%;
  }
  .marker-animation-03:after{
      left: 110px;
      top: -30px;
  }
  .marker-animation-03.active:after{
      width: 20%;
  }
   .marker-animation-04:after{
      left: 110px;
      top: -30px;
  }
  .marker-animation-04.active:after{
      width: 35%;
  }
    
  /*------------------------------
   *pictgram
  --------------------------------*/
  .pict-list{
      display: block;
  }
  .pict-item{
      width: 100%;
      border: none;
      padding-top: 50px;
  }
  .pict-item:first-of-type{
      padding-top: 0;
  }
  .pict-item:nth-of-type(2){
      border-right: transparent;
  }
  .pictgram{
      width: 100%;
      height: auto;
      padding: 0  0 50px;
  }
  .pict-title{
      font-size: 1.6rem;
      padding-bottom: 50px;
  }
  .pict-sentence{
      padding: 0 0 0 ;
      margin-bottom: 50px;
      line-height: 2.3;
      letter-spacing: 0.15em;
  }
  .last-pict-sentence{
      margin-bottom: 0;
  }
    
  /*------------------------------
   *hero-image
  --------------------------------*/
  .hero-image{
      background-image:url("../images/top/hero_sp.jpg"); 
      background-position: center center;
      background-size: cover;
  }
  video{
      background: none;
  }  
  .hero-image-02{
      margin-top: 120px;
  }
  .hero-image-03{
      margin-top: 120px;
      margin-bottom: 50px;
  }
  .title-img{
      height: 174px;
  }
  .FC{
      display: none;
  }
  .FC-recruitment{
      display: none;
  }

  /*------------------------------
   *NEXT
  --------------------------------*/
  .next-message,.next-message-02{
      font-size: 1.6rem;
      letter-spacing: 0.05em;
      padding-bottom: 16px;
  }
  .next-message-02{
      padding-top: 48px;
  }
    
  /*------------------------------
   *VISION
  --------------------------------*/
  /*top*/
  .message{
      font-size: 1.5rem;
      line-height: 2;
  }
  
  /*hero-image*/
  .message-sentence{
      margin-bottom: 55px;
  }
  .message-02{
      padding-left: 0;
      margin-left: 20px;
  }
  .message-04{
      padding-left: 0;
      margin-left: 16px;
  }
  .message-profile{
      font-size: 1.1rem;
      letter-spacing: 0.1em;
  }
  .message-BG{
      background-image:url("../images/vision/img_vision_BG_sp.jpg");
      background-size: cover;
  }
  .ookubo_vision_thumb{
      width: 142.5px;
      margin-bottom: 50px;
  }
  .text-what{
    font-size: 1.5rem;
    line-height: 2.5;
  }
  .separation{
      border-bottom: solid 0.5px #9F9F9F;
  }

  /*------------------------------
   *ALL-INCLUSIVE SALON
  --------------------------------*/	
  /*top*/
  .ais-overview{
      width: 100%;
      line-height: 2;
  }
  .ais__thumb{
      position: static;
      width:100%;
  }	
  /*COURSE*/
  .menu-list{
      display: block;
      margin-left: 0;
  }
  .menu-item{
      width: 100%;
      height: auto;
      margin: 0 0 30px 0;
  }
  .menu-item:last-of-type{
      margin-bottom: 0;
  }
  .menu-title{
      padding: 12px 20px;
  }
  .menu-title>p{
      font-size: 1.8rem;
  }
  .menu-sentence{
      padding-top: 16px;
      letter-spacing: 0.15em;
  }
  .menu-graph{
      padding-top: 50px;
  }
  .menu-link{
      padding-top: 50px;
      font-size: 1.5rem;
      line-height: 2;
      text-align: center;
  }
  .under{
      font-size: 1.5rem;
      border-bottom: solid 3px #C5B8A0;
  }

  /*BENEFIT*/
  .benefit-list{
      display: block;
      margin-bottom: 50px;
  }
  .benefit-list:last-of-type{
      margin-bottom: 0;
  }
  .benefit-list02{
      display: block;
      margin-bottom: 50px;
  }
  .benefit-sentence{
      width: 100%;
	  letter-spacing: 0.1em;
      line-height: 2.3;
  }
    
  /*SALES RESULTS*/
  .sr-title{
	  text-align: center;
      font-size: 1.5rem;
      margin-bottom: 40px;
  }
  .sr-sentence{
      margin-bottom: 50px;
  }

  /*------------------------------
   *VOICE
  --------------------------------*/
  /*top*/
  .voice01-list{
      flex-direction: column;
  }
  .voice01-item{
      width:100%;
      background-color: #F1F1F1;
  }
  .voice01-item__contents{
      padding: 55px 40px 40px;
  }
  .voice-item__name{
      font-size: 1.7rem;
      padding-bottom: 17px;
  }
  .voice-number-0{
      font-size: 10rem;
      transform: translate3d(-20px,0,0);
  }
  .voice-number-number{
      font-size: 10rem;
      transform: translate3d(50px,0,0);
  }
  .voice01-02-number>span{
      padding-left: 170px;
  }
  .voice01-01{
      transform: translateY(0);
      width: 279px;
      padding-top: 330px;
      margin-right: 32px;
  }
  .voice01-02{
      transform: translateY(0);
      width: 279px;
      padding-top: 75px;
      margin-left: 32px;
  }
  .voice02-list{
      display: block;
  }
  .voice02-item{
      width: 100%;
  }
  .voice02-item__contents{
      padding: 40px 40px;
  }
  .voice-number-0-wh{
      font-size: 10rem;
      transform: translate3d(-20px,0,0);
      color: #fff;
  }
  .voice-number-number-wh{
      font-size: 10rem;
      transform: translate3d(50px,0,0);
      color: #fff;
  }
  .voice02-02-number>span{
      padding-left: 170px;
      color: #141414;
  }
  .voice02-01{
      transform: translateY(0);
      width: 279px;
      padding-top: 410px;
      margin-bottom: 75px;
      margin-right: 32px;
  }
  .voice02-02{
      transform: translateY(0);
      width: 279px;
      padding-top: 75px;
      margin-left: 32px;
  }
  .voice-item__name02{
      font-size: 1.7rem;
      line-height: 1;
  }
  .voice02__name_en{
      font-size: 1.1rem;
      line-height: 1;
      letter-spacing: 0.05em;
      margin-bottom: 17px;
  }
	
  /*voice01*/
  .voice-item{
      margin-bottom: 50px;
  }
  .voice-item:last-of-type{
      margin-bottom: 0;
  }
  .voice-title{
	  text-align: center;
      font-size: 1.6rem;
	  letter-spacing: 0.05em;
      margin-bottom: 30px;
  }
  .voice-name{
	  text-align: center;
      font-size: 1.4rem;
      margin-bottom: 30px;
  }
  .voice-sentence{
      width: 100%;
  }
  .voice-base{
      padding: 30px 32px 50px;
  }
  .voice-base02{
      padding: 30px 32px 50px;
  }
	
  /*------------------------------
   *SERVICE
  --------------------------------*/
  /*top*/
  .service-list{
      display: block;
      margin-left: 0;
      position: relative;
  }
  .service-item{
      width: 100%;
      margin-left: 0;
      margin-bottom: 40px;
  }
  .service-item__title{
      padding: 10px 0;
      font-size: 1.3rem;
  }
  .service-item__contents{
      padding: 40px;
      background-color: #fff;
  }
  .service-item__contents::before{
      position: absolute;
      top: 47px;
      left:16px;
      width: 3px;
      height: 50px;
      content:"";
      background: #C5B8A0;
  }

  /*serviceページ*/
  .service-list-02{
      flex-direction: column;
      position: relative;
	  padding-top: 50px;
  }
  .service-list-02_02{
      flex-direction: column;
      position: relative;
	  padding-top: 50px;
  }
  .service-item-02{
      width: 100%;
      padding-left: 0;
  }
  .service-item-02-02{
      padding-right: 0;
  }
  .service-sentence{
      font-size: 1.3rem; 
	  letter-spacing: 0.1em;
  }
  .service-01-sentence{
	  letter-spacing: 0.1em;
      margin-bottom: 30px;
  }
  .service-02-sentence{
	  letter-spacing: 0.1em;
      margin-bottom: 25px;
  }
  .service-03-sentence{
	  letter-spacing: 0.1em;
  }

  /*モーダルウィンドウ*/ 
  .modaal-container{
      width: 100%;
      max-width: 311px !important;
  }
  .modaal-content-container {
      padding: 0 16px;
  }
  .modaal-close{
      right: 43%;
  }
	
  .mb-list{
      flex-direction: column;
      position: relative;
  }
  .mb-list02{
      flex-direction: column;
      position: relative;
  }
  .mb-item{
      width: 100%;
      padding-left: 0;
  }
  .mb-item02{
      width: 100%;
      padding-right: 0;
  }
  .mb-thumb{
	  position:relative;
      z-index: 10000 !important;
  }
  .mb-sentence{
      letter-spacing: 0.1em;
  }
  .louvredo-sentence{
      padding: 20px 0;
  }

  /*QRコード*/
  .QR-sentence01{
      font-size: 1.3rem;
	  letter-spacing: 0.1em;
      text-align: left;
      padding: 50px 32px 30px;
  }
  .QR-sentence02{
      font-size: 1.5rem;
	  line-height: 2.3;
	  text-align: left;
      padding: 0 32px 50px;
  }
  .QRcode{
      width: 120px;
      padding-bottom: 50px;
  }
    
  /*------------------------------
   *Company
  --------------------------------*/
  .business-sentence{
      font-size: 1.5rem;
	  letter-spacing: 0.08em;
  }
  .info-item{
      display: flex;
	  align-items: center;
      border-bottom: solid 1px #141414;
      padding: 20px 0;
  }
  .info-title{
      flex: 0 0 60px;
      width: 60px;
      margin-right: 40px;
      font-size: 1.5rem;
  }
  .info-detail{
      flex: 1 1 auto;
      font-size: 1.3rem;
	  letter-spacing: 0.05em;
	  line-height: 1.5;
  }

  /*member*/
  .member-list{
      flex-direction: column;
      margin-left:0;
  }
  .member{
      width:100%;
      margin:0 0 0 0;
  }
  .member-profile{
      padding-top: 50px;
  }
  .member-job__title{
      font-size: 1.3rem;
	  position: absolute;
	  z-index: 2;
  }
  .member-name{
      padding: 30px 0 16px;
  }
  .member-name__en{
      font-size: 1.3rem;
      margin-bottom: 30px;
  }
  .profile-detail{
      padding-bottom: 50px;
  }
　.profile-detail-02{
      padding-bottom: 0;
  }
  .member-thumb{
      position: absolute;
      z-index: 3;
  }
  /*------------------------------
   *Contact
  --------------------------------*/
  .contact{
      padding: 50px 32px 0;
  }
  .form-parts__text{
      width: 100%;
      padding: 10.5px 8px;
      font-size: 1.3rem;
  }
  .form-item{
      flex-direction: column;
      margin-bottom: 40px;
  }
  .form-item:last-of-type{
      margin-bottom: 50px;
  }
  .form-title{
      width: 170px;
      margin: 0 0 20px 0;
      padding: 0;
  }
  .form-detail{
      width: 100%;
  }
  .caution{
      display: inline;
      width: 25px;
      padding: 3px 5px;
      font-size: 1rem;
  }

	
	
	

}

