@font-face {
  font-family: "noto";
  font-style: normal;
  font-weight: 100;
  src: url("./fonts/Noto/Thin.woff") format("woff");
}

@font-face {
  font-family: "noto";
  font-style: normal;
  font-weight: 200;
  src: url("./fonts/Noto/Light.woff") format("woff");
}

@font-face {
  font-family: "noto";
  font-style: normal;
  font-weight: 300;
  src: url("./fonts/Noto/DemiLight.woff") format("woff");
}
@font-face {
  font-family: "noto";
  font-style: normal;
  font-weight: 400;
  src: url("./fonts/Noto/Regular.woff") format("woff");
}
@font-face {
  font-family: "noto";
  font-style: normal;
  font-weight: 500;
  src: url("./fonts/Noto/Medium.woff") format("woff");
}
@font-face {
  font-family: "noto";
  font-style: normal;
  font-weight: 700;
  src: url("./fonts/Noto/Bold.woff") format("woff");
}
@font-face {
  font-family: "noto";
  font-style: normal;
  font-weight: 900;
  src: url("./fonts/Noto/Black.woff") format("woff");
}

*{
box-sizing: border-box;
overflow-wrap: break-word;
line-height: normal
}

html{
    font-family: 'noto', sans-serif;
	font-size: 14px;
    font-weight:400;
	letter-spacing: 0.03rem;
	line-height: 150%;
	color:#1a1a1a;
	-ms-text-size-adjust: 100%;
	-webkit-text-size-adjust: 100%;
}

body{
	background-color: #FFFFFF;
    color:#000000;
}

*{
box-sizing: border-box;
line-height: normal;
}

.relative{
position: relative;
}

.absolute{
position: absolute;
}

.inner{
position: relative;
width: 100%;
max-width: 1100px;
margin: auto;
}

/*
::-webkit-scrollbar {
    width: 10px;
}

::-webkit-scrollbar-track {
    background-color: rgba(0,0,0,0);
}

::-webkit-scrollbar-thumb {
    box-shadow: inset 0 0 6px rgba(0, 0, 0, 0.3);
}
*/

.forPc{
display: block;
}
.forSp{
display: none;
}


#wrap{
width: 100%;
}

.navigation{
    position: fixed;
    z-index: 100;
    text-align: right;
    width: 100%;
    height: 100px;
    transition:background-color 1s;
}

.navigation.bg{
background-color: rgba(255,255,255,0.8);
}

body:not(.top) .navigation{
    background-color: rgba(255,255,255,0.8);
}


.navigation .inner{
    max-width: 100%;
    padding: 0 10px;
    height: 100px;
}

.navigation img.logo{
    position: absolute;
    left: 30px;
    top: 20px;
    width: 50px;
}

.navigation ul#globalMenu{
    display: flex;
        width: 100%;
        justify-content: flex-end;
}

.navigation ul#globalMenu li{
line-height: 100px;
padding:0 30px
}

.navigation ul#globalMenu li:nth-last-of-type(1){
}

.navigation ul#globalMenu li a{
color:#FFFFFF;
font-size: 1.2rem;
font-weight: 600;
}

.navigation.bg ul#globalMenu li a,
body:not(.top) .navigation ul#globalMenu li a{
color:#ED1C24;
}

#mainimage {
padding: 10px 10px 0 10px;
position: relative;
overflow: hidden;
}


#mainimage img{
max-width: 100%;
}


#mainimage img.mainlogo{
    position: absolute;
    height: 80%;
    left: 50%;
    top:50%;
    -webkit-transform: translate(-50%, -50%);
    transform: translate(-50%, -50%);
}

#mainimage img.scroll{
    position: absolute;
    right: 70px;
    bottom: 70px;
    width: 120px;
/*animation:6s linear infinite rolling;*/
}
@keyframes rolling{
  0%{ transform:rotate(0);}
  100%{ transform:rotate(360deg); }
}

h2.h2title{
color:#ED1C24;
font-size:3.5rem;
font-weight: 600;
position: relative;
}

h2.h2title span.sub{
display: block;
font-size:0.8rem;
position: relative;
}

h2.h2title:before{
    content: "";
    width: 40px;
    height: 1px;
    background-color: #ED1C24;
    position: absolute;
    left: -40px;
    top: 15px;
display: block;
-moz-transform: rotate(-45deg);
    -webkit-transform: rotate(-45deg);
    -o-transform: rotate(-45deg);
    -ms-transform: rotate(-45deg);
transform-origin: left top;
}

#what{
padding: 100px 0
}

#what .whatDetail{
display: block;
position: relative;
margin: 60px 0
}


#what .whatDetail .img{
position: absolute;
right:0;
top:0;
width: 45%;
}

#what .whatDetail .img img{
width: 100%;
}

#what .whatDetail .text{
width: 55%;
padding-right: 50px;

}


#what .whatDetail .text .catch{
margin-bottom: 30px;

}

#what .whatDetail .text p{
color: #ED1C24;
line-height: 1.7rem;
}

#sns img.logo_all{
display: block;
margin:0 auto 30px;
width: 180px;
}


#footer{
padding-top: 150px;
}

#footer .footerBnrs{
padding-bottom: 60px;
}

#footer .footerBnrs ul{
display: flex;
flex-wrap: wrap;
justify-content: center;
}

#footer .footerBnrs ul li{
width: 25%;
padding:0 20px 20px;
}


#footer .footerBnrs ul li img{
width: 100%;

}

#footer .sns{
text-align: center;
}

#footer .sns img{
width: 40px;
margin-right: 30px;
}

#footer .sns a:nth-last-of-type(1) img{
margin-right: 0;
}

#footer .logo{
    padding-top: 50px;
    text-align: center;
}

#footer .logo img{
width: 50%;
max-width: 300px;
}

#footer .footerLink{
padding: 20px 0 40px;
text-align: center;
}

#footer .footerLink a{
color:#000000;
padding:0 10px;
border-right: solid 1px #000000;
}

#footer .footerLink a:nth-last-of-type(1){
border-right: none;
}


#footer p.copy{
text-align: center;
color: #FFFFFF;
background-color: #ED1C24;
padding: 20px 0;
}
#footer .toTop{
    position: fixed;
    right: 20px;
    bottom: 20px;
    width: 60px;
    height: 60px;
    display: block;
    background-color: #D5D5D5;
    border-radius: 10px;
}

#footer .toTop span{
position: relative;
display: block;
width: 60px;
height: 60px;
}

#footer .toTop span:before{
    content: "";
        display: block;
        width: 15px;
        height: 15px;
        border-right: solid 2px #FFFFFF;
        border-bottom: solid 2px #FFFFFF;
        -webkit-transform: translate(-50%, -50%) rotate(-135deg);
        transform: translate(-50%, -50%)rotate(-135deg);
        position: absolute;
        left: 50%;
        top: 50%;
        margin-top: 5px;
}



body:not(.top) #contents{
padding-top: 130px;
}



h1.pagetitle{
color:#ED1C24;
font-size:3.5rem;
font-weight: 600;
position: relative;
margin-bottom: 30px;
}

h1.pagetitle span.sub{
display: block;
font-size:0.8rem;
position: relative;
}

h1.pagetitle:before{
    content: "";
    width: 40px;
    height: 1px;
    background-color: #ED1C24;
    position: absolute;
    left: -40px;
    top: 15px;
display: block;
-moz-transform: rotate(-45deg);
    -webkit-transform: rotate(-45deg);
    -o-transform: rotate(-45deg);
    -ms-transform: rotate(-45deg);
transform-origin: left top;
}

.pageContents{
line-height: 1.5rem;
}

.privacy .block{
    padding-bottom: 40px
}


.privacy h2{
color:#ED1C24;
font-size:1.3rem;
margin-bottom: 20px;
border-bottom:solid 1px #e9e9e9;
padding-bottom: 10px;
}


.privacy h3{
font-size: 1.1rem;
padding-top:10px;
padding-bottom: 5px;
color: #ED1C24;
}

.privacy p{
padding-bottom: 10px;
}

.privacy ul{
list-style: disc;
padding-left: 1.4rem
}


.privacy p.ulafter{
        padding-left: 1.4rem;
}


.company table{
width: 100%;
table-layout: fixed;
}

.company table th,
.company table td{
padding: 20px;
}
.company table th{
width: 200px;
background-color: #f9f9f9
}


.company table td {
width: calc(100% - 200px);
border-bottom:solid 1px #f9f9f9;

}
.company table tr:nth-of-type(1) td{
border-top:solid 1px #f9f9f9;

}

.pageBack {
text-align: center;
padding: 50px 0
}


.pageBack a.Btn{
text-decoration: none;
text-align: center;
display: block;
width: 90%;
max-width: 300px;
color:#FFFFFF;
font-weight: 600;
padding: 20px 0;
background-color: #ED1C24;
margin: auto;
position: relative;
}


@media screen and (max-width:1120px) {
    .inner{
        padding-left: 10px;
        padding-right: 10px;
    }
}
