@charset "utf-8";
@media all and (max-width: 768px){

/*================*/
html{
    font-size: 4vw;
    color: rgba(0,0,0,1);
}
body{
    font-family: "Noto Sans JP",sans-serif;
    font-feature-settings: "palt" 1;
    font-weight: 700;
}
#wrap{
    position: relative;
}
main{
    position: relative;
    padding: 50px 0 0 0;
}
section{
    position: relative;
}
section>.inner{
    position: relative;
}

/*================*/
*{
    font-weight: 700;
}
br.pc{
    display: none;
}
a,
label{
    width: 100%;
    height: 100%;
    color: rgba(0,0,0,1);
}
figure,
.figelm{
    display: block;
    width: 100%;
    height: 100%;
    font-size: 0;
    background-repeat: no-repeat;
    background-position: 0 0;
    background-size: 100% auto;
    -webkit-backface-visibility: hidden;
}

/*================*/
#svgdef{
    position: absolute;
    left: 0;
    top: 0;
    width: 0;
    height: 0;
}
svg{
    position: absolute;
    left: 0;
    top: 0;
    width: 100%;
    height: 100%;
    fill: rgba(0,0,0,0);
    stroke: rgba(0,0,0,0);
    stroke-width: 0;
    stroke-opacity: 1;
    stroke-linecap: round;
    stroke-linejoin: miter;
}

/*================*/
.scrollbardeco{
    scrollbar-width: thin;
    scrollbar-color: #00823c #AAAAAA;
}
.scrollbardeco::-webkit-scrollbar{
    width: 1vw;
}
.scrollbardeco::-webkit-scrollbar-thumb{
    background-color: #00823c ;
}
.scrollbardeco::-webkit-scrollbar-track{
    background-color: #AAAAAA;
}

/*================*/
header{
    position: fixed;
    left: 0;
    top: 0;
    width: 100%;
    height: 50px;
    background-color: rgba(255,255,255,1);
    z-index: 4;
}
header>.inner{
    position: relative;
    width: 100%;
    height: 100%;
    border-style: solid;
    border-width: 0 0 1px 0;
    border-color: rgba(220,220,220,1);
}
/*--------*/
header .logobox{
    position: absolute;
    left: 10px;
    top: 0;
    width: 100px;
    height: 100%;
}
header .logobox .myself{
    position: absolute;
    left: 0;
    top: 0;
    width: 100%;
    height: 100%;
}
header .logobox .myself a{
}
header .logobox .myself span{
    position: absolute;
    left: 5px;
    top: 4px;
    width: 66px;
    height: 46px;
    background-image: url(../images/common/logo_myself.svg);
}
/*--------*/
header .menubox{
    position: absolute;
    right: 70px;
    top: 0;
    width: 164px;
    height: 100%;
}
header .menubox ul{
    display: flex;
    justify-content: end;
    align-items: center;
    flex-wrap: nowrap;
    padding: 14px 0 0 0;
}
header .menubox ul>li{
    position: relative;
    height: 25px;
    line-height: 25px;
    margin: 0 0 0 10px;
}
header .menubox ul>li:nth-of-type(1){
    margin: 0 0 0 0;
}
header .menubox ul>li a{
}
header .menubox ul>li span{
    display: block;
    width: 100%;
    height: 100%;
    white-space: nowrap;
}
header .menubox ul>li.n1{
    display: none;
}
header .menubox ul>li.n2{
    width: 90px;
}
header .menubox ul>li.n2 span{
    font-size: 10px;
    color: rgba(255,255,255,1);
    background-color: rgba(0,130,60,1);
    text-indent: 25px;
}
header .menubox ul>li.n2 i{
    position: absolute;
    left: 5px;
    top: 7px;
    width: 16px;
    height: 12px;
    background-image: url(../images/common/icon_mail.svg);
}
header .menubox ul>li.n3{
    width: 56px;
}
header .menubox ul>li.n3 span{
    background-image: url(../images/common/logo_jeki.png);
}
/*--------*/
header .navigationbox{
    position: absolute;
    right: 0;
    top: 0;
    width: 50px;
    height: 100%;
}
header .navigationbox .navibtn{
    position: absolute;
    left: 10px;
    top: 10px;
    width: 30px;
    height: 30px;
}
header .navigationbox .navibtn label{
}
header .navigationbox .navibtn i{
    position: absolute;
    right: 0;
    width: 100%;
    height: 2px;
    background-color: rgba(0,0,0,1);
    opacity: 1;
    -webkit-transition-property: transform;
    transition-property: transform;
    -webkit-transition-duration: 0.5s;
    transition-duration: 0.5s;
    -webkit-transition-timing-function: linear;
    transition-timing-function: linear;
    -webkit-transform-origin: right center;
    transform-origin: right center;
    -webkit-transform: rotate(0deg);
    transform: rotate(0deg);
}
header .navigationbox .navibtn i.n1{
    top: 4px;
}
header .navigationbox .navibtn i.n2{
    top: 14px;
}
header .navigationbox .navibtn i.n3{
    top: 24px;
}
header .navigationbox .navibtn label.open i.n1{
    -webkit-transform: rotate(-42deg);
    transform: rotate(-42deg);
}
header .navigationbox .navibtn label.open i.n2{
    opacity: 0;
}
header .navigationbox .navibtn label.open i.n3{
    -webkit-transform: rotate(42deg);
    transform: rotate(42deg);
}

/*================*/
footer{
    position: relative;
    width: 100%;
}
footer>.inner{
    position: relative;
}
/*--------*/
footer .menubox{
    width: 62vw;
    padding: 6vw 0 6vw 0;
    margin: 0 auto 0 auto;
}
footer .menubox ul{
    display: flex;
    justify-content: space-between;
    align-items: center;
    flex-wrap: nowrap;
}
footer .menubox ul>li{
}
footer .menubox ul>li a{
}
footer .menubox ul>li p{
    font-size: 0.9rem;
    text-decoration: underline;
}
/*--------*/
footer .snsbox{
    width: 50vw;
    padding: 0 0 6vw 0;
    margin: 0 auto 0 auto;
}
footer .snsbox ul{
    display: flex;
    justify-content: center;
    align-items: center;
    flex-wrap: nowrap;
}
footer .snsbox ul>li{
    width: 10vw;
    height: 10vw;
    margin: 0 0.3vw;
}
footer .snsbox ul>li a{
}
footer .snsbox ul>li figure{
}
footer .snsbox ul>li.n1 figure{
    background-image: url(../images/common/ico_sns_fb.svg);
}
footer .snsbox ul>li.n2 figure{
    background-image: url(../images/common/ico_sns_instagram.svg);
}
footer .snsbox ul>li.n3 figure{
    background-image: url(../images/common/ico_sns_X.svg);
}
/*--------*/
footer .crbox{
    padding: 0 0 8vw 0;
    text-align: center;
}
footer .crbox p{
    font-size: 0.72rem;
}

/*================*/
.pagetopscroller{
    position: fixed;
    right: 10px;
    bottom: -90px;
    width: 40px;
    height: 40px;
    border-radius: 40px;
    background-color: rgba(0,130,60,1);
    z-index: 1;
    -webkit-transition-property: bottom,transform;
    transition-property: bottom,transform;
    -webkit-transition-duration: 0.6s;
    transition-duration: 0.6s;
    -webkit-transition-timing-function: linear;
    transition-timing-function: linear;
    -webkit-transform-origin: center center;
    transform-origin: center center;
    -webkit-transform: rotateZ(720deg);
    transform: rotateZ(720deg);
}
.pagetopscroller.appear{
    bottom: 10px;
    -webkit-transform: rotateZ(0deg);
    transform: rotateZ(0deg);
}
.pagetopscroller i{
    position: absolute;
    left: 8px;
    top: 13px;
    width: 24px;
    height: 12px;
}
.pagetopscroller i>svg{
    stroke: rgba(255,255,255,1);
    stroke-width: 2;
}

/*================*/
.navibody{
    position: relative;
    width: 66vw;
    margin: 50px 0 0 auto;
}
.navibody>.inner{
}
/*--------*/
.navibody .frame{
    height: 132vw;
    background-color: rgba(255,255,255,1);
}
/*--------*/
.navibody .listbox{
    padding: 4vw 0 4vw 0;
}
.navibody .listbox ul{
}
.navibody .listbox ul>li{
    position: relative;
    padding: 1vw 0 1vw 0;
    white-space: nowrap;
    margin: 6vw 0 6vw 0;
}
.navibody .listbox ul>li .parent{
    position: relative;
}
.navibody .listbox ul>li .parent a{
}
.navibody .listbox ul>li .parent .belt{
    position: absolute;
    right: 0;
    top: 0;
    width: 3vw;
    height: 5.5vw;
}
.navibody .listbox ul>li.n1 .parent .belt{
    background-color: rgba(149,149,149,1);
}
.navibody .listbox ul>li.n2 .parent .belt{
    background-color: rgba(44,165,222,1);
}
.navibody .listbox ul>li.n3 .parent .belt{
    background-color: rgba(249,204,0,1);
}
.navibody .listbox ul>li.n4 .parent .belt{
    background-color: rgba(49,128,64,1);
}
.navibody .listbox ul>li.n5 .parent .belt{
    background-color: rgba(225,13,124,1);
}
.navibody .listbox ul>li.n6 .parent .belt{
    background-color: rgba(149,149,149,1);
}
.navibody .listbox ul>li .parent p{
    padding: 0 5vw 0 0;
    font-size: 1.3rem;
    letter-spacing: 0.08em;
    text-align: right;
}
.navibody .listbox ul>li.n1 .parent p{
    color: rgba(149,149,149,1);
}
.navibody .listbox ul>li.n2 .parent p{
    color: rgba(44,165,222,1);
}
.navibody .listbox ul>li.n3 .parent p{
    color: rgba(249,204,0,1);
}
.navibody .listbox ul>li.n4 .parent p{
    color: rgba(49,128,64,1);
}
.navibody .listbox ul>li.n5 .parent p{
    color: rgba(225,13,124,1);
}
.navibody .listbox ul>li.n6 .parent p{
    color: rgba(149,149,149,1);
}
.navibody .listbox ul>li .child{
}
.navibody .listbox ul>li .child .each{
    margin: 6vw 0 6vw 0;
}
.navibody .listbox ul>li .child .each a{
}
.navibody .listbox ul>li .child .each p{
    padding: 0 5vw 0 0;
    font-size: 1.0rem;
    letter-spacing: 0.08em;
    text-align: right;
}
.navibody .listbox ul>li.n1 .child .each p{
    color: rgba(149,149,149,1);
}
/*--------*/
.navibody .snsbox{
    width: 40vw;
    margin: 0 0 0 auto;
}
.navibody .snsbox ul{
    display: flex;
    justify-content: center;
    align-items: center;
    flex-wrap: nowrap;
}
.navibody .snsbox ul>li{
    width: 10vw;
    height: 10vw;
    margin: 0 0.5vw;
}
.navibody .snsbox ul>li a{
}
.navibody .snsbox ul>li figure{
}
.navibody .snsbox ul>li.n1 figure{
    background-image: url(../images/common/ico_sns_fb.svg);
}
.navibody .snsbox ul>li.n2 figure{
    background-image: url(../images/common/ico_sns_instagram.svg);
}
.navibody .snsbox ul>li.n3 figure{
    background-image: url(../images/common/ico_sns_X.svg);
}
.navibody .listbox ul>li.sleep{
    opacity: 0.1;
}
.navibody .listbox ul>li.sleep::after{
    content: "";
    position: absolute;
    left: 0;
    top: 0;
    width: 100%;
    height: 100%;
}

/*================*/
section.others{
    background-color: rgba(240,240,240,1);
}
section.others>.inner{
}
/*--------*/
section.others .bannerbox{
    padding: 12vw 0 12vw 0;
}
section.others .bannerbox ul{
}
section.others .bannerbox ul>li{
    width: 88vw;
    height: 41vw;
    background-color: rgba(255,255,255,1);
    margin: 4vw auto 0 auto;
}
section.others .bannerbox ul>li:nth-of-type(1){
    margin: 0 auto 0 auto;
}
section.others .bannerbox ul>li.pad{
    display: none;
}
section.others .bannerbox ul>li a{
}
section.others .bannerbox ul>li figure{
    background-position: 50% 50%;
    border-style: solid;
    border-width: 1px;
    border-color: rgba(0,0,0,1);
}
section.others .bannerbox ul>li.n1 figure{
    background-size: 60% auto;
    background-image: url(../images/common/logo_myself.svg);
}
section.others .bannerbox ul>li.n2 figure{
    background-size: 64% auto;
    background-image: url(../images/common/bnr_mitemo.png);
}
section.others .bannerbox ul>li.n3 figure{
    background-size: 50% auto;
    background-image: url(../images/common/logo_jeki.png);
}
section.others .bannerbox ul>li.n4 figure{
    background-size: 40% auto;
    background-image: url(../images/common/bnr_ebisuhatsu.png);
}
section.others .bannerbox ul>li.n5 figure{
    background-size: 90% auto;
    background-image: url(../images/common/bnr_onlinesoudan.png);
}
section.others .bannerbox ul>li.n6 figure{
    background-size: 90% auto;
    background-image: url(../images/common/bnr_socialbusiness.png);
}

} /* End of media query */