@charset "euc-jp";
/* CSS Document */

html{
    margin-top: 0;
    margin-right: 0;
    margin-left: 0;
    margin-bottom: 0;
    padding-top: 0;
    padding-right: 0;
    padding-left: 0;
    padding-bottom: 0;
    border: 0;
    font-family: inherit;
    vertical-align: baseline;
    font-size: 14px;
	color: #444444;
}
#main {
	width: 98%;
	max-width: 1000px;
	margin-right: auto;
	margin-left: auto;
}
    
.content1
    {
        text-align: center
    }
.content1 img{
    width: 100%;
}

.content1 p{
    letter-spacing: 0.2rem;
	font-family: kozuka-gothic-pro, sans-serif;
	color: #444444;
	line-height: 300%;
	letter-spacing: 0.2rem;
}

.box1
{
    postion: relative;
}
#main .box1 img {
	width: 100%;
}

/*
.box1 div.text
{
    position: absolute;
    left: 6%;
    top: 5%;
    font-size: 2.4rem;
    font-family: a-otf-ryumin-pr6n, serif;
    font-style: normal;
    line-height: 1.6em;
   }
*/
    
.box2
{
	position: relative;
	margin-bottom: 16rem;
}
    .box2 img{
        width: 100%;
    }

.box2 div.text2
{
	position: absolute;
	width: 100%;
	left: 0%;
	top: 15%;
	text-align: center;
	font-size: 1rem;
	font-weight: 400;
	font-family: kozuka-gothic-pro, sans-serif;
	color: #444444;
	letter-spacing: 0.2em;
    
}
}    
#main .fadein.content1 img {
	width: 100%;
}  

.linkbanner {
	margin-right: auto;
	margin-left: auto;
	width: 50%;
    max-width: 300px;
	margin-top: 4rem;
	margin-bottom: 5rem;
}
.logo {
	width: 40%;
	max-width: 300px;
	margin-right: auto;
	margin-left: auto;
	margin-bottom: 2rem;
	margin-top: 2rem;
}


@media screen and (min-width: 1025px) {	
h1{
    font-size: 3rem;
    letter-spacing: 0.2rem;    
	font-family: a-otf-ud-shin-go-pr6n, sans-serif;
	font-weight: 300;
	font-style: normal;
}

    h2{
    font-size: 2rem;
    line-height: 300%;
    letter-spacing: 0.2rem;    
	font-family: a-otf-ud-shin-go-pr6n, sans-serif;
	font-weight: 300;
	font-style: normal;
}    
}
    
@media only screen and (min-width:481px) and (max-width:1024px) {
h1{
    font-size: 2.2rem;
    letter-spacing: 0.2rem;    
	font-family: a-otf-ud-shin-go-pr6n, sans-serif;
	font-weight: 300;
	font-style: normal;
}

    h2{
    font-size: 1.8rem;
    line-height: 300%;
    letter-spacing: 0.2rem;    
	font-family: a-otf-ud-shin-go-pr6n, sans-serif;
	font-weight: 300;
	font-style: normal;
} 
}

@media screen and (max-width: 480px){    
h1 {
    font-size: 2.2rem;
    letter-spacing: 0.2rem;    
	font-family: a-otf-ud-shin-go-pr6n, sans-serif;
	font-weight: 300;
	font-style: normal;
}

    h2{
    font-size: 1.6rem;
    line-height: 300%;
    letter-spacing: 0.2rem;    
	font-family: a-otf-ud-shin-go-pr6n, sans-serif;
	font-weight: 300;
	font-style: normal;
}   
}

/*
@media only screen and (min-width:481px) and (max-width:1024px) {

.box1
{
    postion: relative;
}
    .box1 img{
        width: 100%;
    }

.box1 div.text
{
    position: absolute;
    left: 6%;
    top: 6%;
    font-size: 5rem;
    font-family: a-otf-ryumin-pr6n, serif;
    font-style: normal;
    line-height: 2em;
   }
    
.content1
    {
    font-size: 1.2rem;
    font-family: kozuka-gothic-pro, sans-serif;
    font-style: normal;
    color: #6C6B6B;
    text-align: center;
    line-height: 2.5em;
    letter-spacing: 0.2em;
    }
#main .fadein.content1 img {
	width: 100%;
}
    
.box2
{
    position: relative;
}

.box2 div.text2
{
    position: absolute;
    width: 100%;
    left: 0%;
    top: 15%;
    text-align: center;
    font-size: 1.2rem;
    font-weight: 400;
    font-family: kozuka-gothic-pro, sans-serif;
    line-height: 2.5em;
    letter-spacing: 0.2em;
    
}
	
h1{
    line-height: 175%;
    letter-spacing: 0.2rem;
	}   

    h2{
	line-height: 1.2em;
  }        

}

@media screen and (min-width: 1025px) {
    
 .box1
{
    postion: relative;
}

.box1 div.text
{
    position: absolute;
    left: 7%;
    top: 5%;
    font-size: 6rem;
    font-family: a-otf-ryumin-pr6n, serif;
    font-style: normal;
    line-height: 2em;
   }
    
.content1
    {
    font-size: 1.6rem;
    font-weight: 80px;
    font-family: kozuka-gothic-pro, sans-serif;
    font-style: normal;
    color: #6C6B6B;
    text-align: center;
    line-height: 2.5em;
    letter-spacing: 0.2em;
    }
#main .fadein.content1 img {
	width: 100%;
}
    
.box2
{
    position: relative;
}

.box2 div.text2
{
    position: absolute;
    width: 100%;
    left: 0%;
    top: 15%;
    text-align: center;
    font-size: 1.6rem;
    font-weight: 400;
    font-family: kozuka-gothic-pro, sans-serif;
    line-height: 2.5em;
    letter-spacing: 0.2em;
    
}
	
h1{
    line-height: 175%;
    letter-spacing: 0.2rem;
	}

    h2{
	line-height: 1.2em;
}    
} 
*/
 /* fadein */

.fadein{
  opacity: 0;  
  transform : translate(0, 50px); 
  transition : all 700ms;
}

.fadein.scrollin{
  opacity: 1;
  transform: translate(0, 0); 
  transition : all 1500ms;    
}
        
.mb1 {
    margin-bottom:1em; 
   }

.mb2 {
    margin-bottom:2em; 
   }  

.mb3 {
    margin-bottom:3em; 
   }  

.mb4 {
    margin-bottom:4em; 
   }  

.mb5 {
    margin-bottom:5em; 
   }       

.mb6 {
    margin-bottom:6em; 
   }       

.mb7 {
    margin-bottom:7em; 
   }       

.mb8 {
    margin-bottom:8em; 
   }       
    
.mb9 {
    margin-bottom: 9em; 
   } 

.mb10 {
    margin-bottom:10em;
}

.mb20 {
    margin-bottom:20em;
}