@charset  "UTF-8";
/* CSS Document */
html,body {
	width: 100%;
	height: 100%;
}

body {
	padding-top: 100px;
	font-family: 'Noto Sans',"Hiragino Kaku Gothic ProN",Meiryo,sans-serif;
}

h1,h2,h3 {
	font-family: 'Noto Serif';
}

.heading {
	font-size: 40px;
}

h3 {
	font-size: 20px;
}

hr {
	border-top: 1px solid #636363;
}

.container {
	overflow: hidden;
}

.content {
	padding: 150px 0;
}

.header {
	min-height: 680px;
}

/* SECTION */
.ko {
	background: rgba(221,154,162,0.5);
}

.n {
	color: #fff;
	background: rgba(8,21,77,0.5);
}

.ni {
	color: #fff;
	background: rgba(255,255,255,0.2);
}

.chi {
	background: rgba(255,255,255,0.5);
}

.wa {
	background: rgba(0,136,60,0.1);
}

.konnichiwa {
	background: rgba(255,228,231,0.5);
}

.links {
	background: rgba(255,255,255,0.5);
	margin-top: 20px;
	margin-bottom: 20px;
	padding: 30px 0;
}

.ko,.n,.ni,.chi,.wa,.konnichiwa,.links {
	padding: 30px;
}

/* NAV */
.navbar-custom {
	margin-bottom: 0;
	border-bottom: 1px solid rgba(255,255,255,.3);
	text-transform: uppercase;
	font-family: 'Noto Sans',Helvetica,Arial,sans-serif;
	background-color: #333;
}

.navbar-custom .navbar-brand {
	/*font-weight: 700;*/
}

.navbar-custom .navbar-brand:focus {
	outline: 0;
}

.navbar-custom .navbar-brand .navbar-toggle {
	padding: 4px 6px;
	font-size: 16px;
	color: #fff;
}

.navbar-custom .navbar-brand .navbar-toggle:focus,.navbar-custom .navbar-brand .navbar-toggle:active {
	outline: 0;
}

.navbar-custom a {
	color: #fff;
}

.navbar-custom .nav li a {
	-webkit-transition: background .3s ease-in-out;
	-moz-transition: background .3s ease-in-out;
	transition: background .3s ease-in-out;
}

.navbar-custom .nav li a:hover {
	outline: 0;
	color: rgba(255,255,255,.8);
	background-color: transparent;
}

.navbar-custom .nav li a:focus,.navbar-custom .nav li a:active {
	outline: 0;
	background-color: transparent;
}

.navbar-custom .nav li.active {
	outline: 0;
}

.navbar-custom .nav li.active a {
	background-color: rgba(255,255,255,.3);
}

.navbar-custom .nav li.active a:hover {
	color: #fff;
}

@media(min-width:768px) {
	.navbar-custom {
		padding: 20px 0;
		border-bottom: 0;
		letter-spacing: 1px;
		background: 0 0;
		-webkit-transition: background .5s ease-in-out,padding .5s ease-in-out;
		-moz-transition: background .5s ease-in-out,padding .5s ease-in-out;
		transition: background .5s ease-in-out,padding .5s ease-in-out;
	}

	.navbar-custom.top-nav-collapse {
		padding: 0;
		border-bottom: 1px solid rgba(255,255,255,.3);
		background: #333;
	}
}

.fa {
	color: #fff;
}

.fa-chevron-circle-up {
	color: #333;
}

/* TO PAGETOP BTN*/
.pagetop {
	display: none;
	position: fixed;
	bottom: 50px;
	right: 20px;
}

.pagetop a:link {
	display: block;
	text-align: center;
	color: rgba(68,182,174,1);
	text-decoration: none;
	-webkit-transition: all .3s;
	-moz-transition: all .3s;
	transition: all .3s;
}

.pagetop a:hover {
	display: block;
	text-align: center;
	color: rgba(68,182,174,.8);
	text-decoration: none;
}

.navbar-fixed-bottom {
	height: 30px;
	background: #333;
	color: #fff;
}

/* IMAGES*/
.hinomaru {
	width: 260px;
	height: auto;
}

.hiragana {
	width: 120px;
	height: auto;
}

.hiragana-konnichiwa {
	width: 260px;
	height: auto;
}

/* BACKGROUND */
#ko {
	background: url(../images/bg-sushi-sm.png);
	background-position: 50% 50%;
}

#n {
	background: url(../images/bg-tokyo-sm.png);
	background-position: top left;
}

#ni {
	background: url(../images/bg-asakusa-sm.png);
	background-position: 50% 50%;
}

#chi {
	background: url(../images/bg-crafts-sm.png);
	background-position: center left;
}

#wa {
	background: url(../images/bg-kamifusen-sm.png);
	background-position: 50% 50%;
}

#konnichiwa {
	background: url(../images/bg-sakura-sm.png);
	background-position: 50% 50%;
}

#links {
	background: url(../images/bg-nami-sm.png);
	background-position: 50% 50%;
}

#ko,#n,#ni,#chi,#wa,#konnichiwa,#links {
	background-size: cover;
	background-attachment: fixed;
	min-height: 1024px;
}

@media only screen and (min-width : 480px) {
	/* IMAGES*/
	.hinomaru {
		width: 320px;
		height: auto;
	}

	.hiragana {
		width: 140px;
		height: auto;
	}

	.hiragana-konnichiwa {
		width: 400px;
		height: auto;
	}

	/* SECTION */
	.n,.chi {
		text-align: right;
	}

	.konnichiwa {
		text-align: center;
	}

	.ko,.n,.ni,.chi,.wa,.konnichiwa,.links {
		padding: 40px;
	}
}

@media only screen and (min-width : 768px) {
	.heading {
		font-size: 48px;
	}

	.header {
		min-height: 1125px;
	}

	/* IMAGES*/
	.hinomaru {
		width: 360px;
		height: auto;
	}

	.hiragana {
		width: 160px;
		height: auto;
	}

	.hiragana-konnichiwa {
		width: 460px;
		height: auto;
	}

	/* SECTION */
	.n,.chi {
		text-align: right;
	}

	.konnichiwa {
		text-align: center;
	}

	/* BACKGROUND*/
	#ko {
		background: url(../images/bg-sushi.png);
		background-position: 50% 50%;
	}

	#n {
		background: url(../images/bg-tokyo.png);
		background-position: top left;
	}

	#ni {
		background: url(../images/bg-asakusa.png);
		background-position: center right;
	}

	#chi {
		background: url(../images/bg-crafts.png);
		background-position: center left;
	}

	#wa {
		background: url(../images/bg-kamifusen.png);
		background-position: 50% 50%;
	}

	#konnichiwa {
		background: url(../images/bg-sakura.png);
		background-position: 50% 50%;
	}

	#links {
		background: url(../images/bg-nami.png);
		background-position: 50% 50%;
	}

	#ko,#n,#ni,#chi,#wa,#konnichiwa,#links {
		background-size: cover;
		background-attachment: fixed;
		min-height: 1024px;
	}
}