@charset "utf-8";

html { scroll-behavior: smooth;}
body {
    font-family: 'Noto Serif JP', serif;
	color: #000;
	font-size: 1.25rem;
	line-height: 2.2;
	text-align: justify;
	-webkit-font-smoothing: antialiased;
	-moz-osx-font-smoothing: grayscale;
	-webkit-text-size-adjust: 100%; 
	word-wrap: break-word;    
}
_:-ms-lang(x)::-ms-backdrop, body { /*IE11用ハック*/
    overflow-x: hidden;
}
@media screen and (max-width:768px) {
    body {
        font-size:0.95rem;
    }
}
@media screen and (max-width:540px) {
    body {
        font-size:0.8rem;
		line-height: 2;
    }
}
@media screen and (max-width:320px) {
    body {
        font-size:0.75rem;
		line-height: 1.8;
    }
}

* { box-sizing: border-box; }

ul {
	margin:0;
	padding: 0;
	list-style: none;
}

a {
	color: #000;
	text-decoration: none;
    outline: none;
}

img {
    width: 100%;
    height: auto;
}


#container {
	padding-top: 3vw;
	overflow: auto;
	scroll-snap-type: y mandatory;
	height: 100vh;
}
@media screen and (max-width:540px) {
	#container {
		padding-top: 60px;
	}
}
.fixed {
	scroll-snap-align: end;
	height: 100vh;
	display: flex;
	align-items: center;
	width: 100%;
}

.inner {
	padding: 0 20vw;
}
@media screen and (max-width:540px) {
	.inner {
		padding:0 60px;
	}
}
@media screen and (max-width:320px) {
	.inner {
		padding:0 45px;
	}
}

.inner h2 {
	padding-bottom: 1vw;
	font-size: 1.7rem;
}
@media screen and (max-width:540px) {
	.inner h2 {
		font-size: 1rem;
	}
}


/* remetech LOGO */

	img.logo_txt_r {
		margin: 0 0.3% 0.2% 0;
		width: 150px;
		vertical-align: middle;
	}
	@media screen and (max-width:768px) {
		img.logo_txt_r {
			width: 120px!important;
		}
	}
	@media screen and (max-width:540px) {
		img.logo_txt_r {
			margin: 0 1% 1% 0;
			width: 95px!important;
		}
	}


/* font-family */

	#header h1,
	#footer,
	nav {
	    font-family: 'Cormorant Garamond', serif;
	}


/* header */

	#header h1 {
	    position: fixed;
	    z-index: 9999;
	    top: 3vh;
	    left: 2vw;
	    font-size: 2.5rem;
	    font-weight: normal;
	    line-height: 1;
	}
	@media screen and (max-width:768px) {
		#header h1 {
		    font-size: 1.5rem;
		    top: 4vh;
		    left: 4vw;
		}
	}


/* footer */

	#footer small {
	    position: fixed;
	    display: block;
	    left:0;
	    top:50%;
	    transform: rotate(-90deg);
	    z-index: 2;
	    line-height: 1;
	    letter-spacing: 0.1em;
	}
	#footer p {
	    position: fixed;
	    display: block;
	    right:0;
	    top:50%;
	    transform: rotate(90deg);
	    z-index: 2;
	    line-height: 1;
	    letter-spacing: 0.1em;
	}
	@media screen and (max-width:320px) {
		#footer small{
		    left: -20px;
		}
		#footer p {
		    right: -10px;
		}
	}



/* about */

	#about {
/*	    display: flex;
	    justify-content: center;
	    align-items: center;*/
	}

	#about .about-list {
	    width: 60vw;
	    margin: 0 auto;
	}

	#about .about-list li {
	    border-bottom: 1px solid #000;
	    margin: 0 0 15px 0;
	    padding: 0 0 15px 0;
	}

	#about .about-list dl {
		display: flex;
	    justify-content: space-between;
	}

	#about .about-list dt {
	    width: 30vw;
	    padding: 0 0 0 2vw;
	    white-space: nowrap;
	}

	#about .about-list dd {
	    width: 68vw;
	}


	@media screen and (max-width:768px) {
		#about {
		    padding: 5vh 0 0 0;
		}
		    
		#about h2 {
		    padding:10vh 0 0 0;  
		}

		#about .about-list { 
		    width:68vw;
		}
	}


/* policy */
	.policy-box {
		margin-top: 10vw;
		margin-bottom: 5vw;
	}
	@media screen and (max-width:768px) {
		.policy-box {
			margin-top: 20vw;
		}
	}
	.policy-txt {
		font-size: 0.7rem;
	}