/* ------------------------------------------------------
リセット
--------------------------------------------------------*/
body{
	background:none;
}
html, body, div, span, applet, object, iframe,
h1, h2, h3, h4, h5, h6, p, blockquote, pre,
a, abbr, acronym, address, big, cite, code,
del, dfn, em, img, ins, kbd, q, s, samp,
small, strike, strong, sub, sup, tt, var,
b, u, i, center,
dl, dt, dd, ol, ul, li,
fieldset, form, label, legend,
table, caption, tbody, tfoot, thead, tr, th, td,
article, aside, canvas, details, embed,
figure, figcaption, footer, header, hgroup,
menu, nav, output, ruby, section, summary,
time, mark, audio, video{
	margin:0;
	padding:0;
	border:0;
	font-size:100%;
	font-weight:normal;
	font:inherit;
	vertical-align:baseline;
}
textarea,
select,
input,
input:focus,
a:focus,
.btn:focus,
.btn:active:focus,
.btn.active:focus, .btn.focus,
.btn.focus:active,
.btn.active.focus{
	outline:none;
}
img{
	border:none;
	vertical-align:top; /*forIE*/
}
em{
	font-style:normal;
}

/* HTML5 display-role reset for older browsers */
article, aside, details, figcaption, figure,
footer, header, hgroup, menu, nav, section{
	display:block;
}
body{
	line-height:1;
}
ol,
ul{
	list-style:none;
}
blockquote,
q{
	quotes:none;
}
blockquote:before, blockquote:after,
q:before, q:after{
	content:'';
	content:none;
}
table{
	border-collapse:collapse;
	border-spacing:0;
}


/* ------------------------------------------------------
初期設定
--------------------------------------------------------*/
html{
	font-size:10px;
	background:#FFF; /* html背景（白） */
}
body,
textarea,
select,
input{
	font-family:'Lucida Grande', Meiryo, "メイリオ", 'Hiragino Kaku Gothic ProN', 'ヒラギノ角ゴ ProN W3', Osaka, "MS PGothic", "ＭＳ Ｐゴシック", sans-serif !important;
	color:#6D6C69 !important;; /* ピジョン */
	-webkit-text-size-adjust:100% !important; /*スマホ用 （文字サイズ調整OFF）*/
	font-size:1.4rem !important;
}
a{
	color:#417038; /* スピナッチグリーン */
}
a:hover,
a:focus,
a:active{
	color:#838D3B; /* ムス */
	text-decoration:none;
}
a:hover img{
	filter:alpha(opacity=80); opacity:.8;
}
h1{
	font-size:1.6rem;
	line-height:1.2;
}
p{
	line-height:1.5;
}

html *{
	-webkit-font-smoothing:antialiased;
	-moz-osx-font-smoothing:grayscale;
}
*, *:after, *:before{
	-webkit-box-sizing:border-box;
	-moz-box-sizing:border-box;
	box-sizing:border-box;
}
/*
::-webkit-scrollbar{
	display:none;
}
*/

/* テキスト選択時の背景色 */
*::selection{
	background:#E8F5FA;
}
*::-moz-selection{
	background:#E8F5FA;
}

/* セレクト選択時の背景色 */
select option[selected]{
	background:#CCC;
}

/* オートフィル（自動入力）の背景色 for Chrome */
input:-webkit-autofill,
textarea:-webkit-autofill,
select:-webkit-autofill{
	-webkit-box-shadow:0 0 0px 1000px white inset;
}

.nopadding{
	padding:0;
}
.custompadding{
	padding-left:5px;
	padding-right:5px;
}
.no-margin{
	margin-right:0;
	margin-left:0;
}
.underline{
	display:inline;
	border-bottom:3px solid #333;
	padding-bottom:0;
}
.after-line{
	height:3px;
	width:100px;
	background:#001CFF;
	margin-top:-10px;
	-webkit-transition:0.5s;
	-moz-transition:0.5s;
	transition:0.5s;
}
.sup-title{
	display:inline-block;
	font-size:1em;
	padding:4px;
	text-transform:uppercase;
	font-weight:bold;
	color:#FFF;
	background:#000000;
	margin:0 0 20px 0;
}
#loading{
	width:100%;
	height:100%;
	top:0px;
	left:0px;
	position:fixed;
	opacity:1;
	background-color:#FCFAF2; /* 白練 */
	z-index:9999;
	text-align:center;
}
#loading-image{
	display:inline;
	top:40%;
	position:relative;
	z-index:9999;
}


/* ------------------------------------------------------
Wrapper
--------------------------------------------------------*/
.wrapper{
	min-width:290px;
}


/* ------------------------------------------------------
Navbar
--------------------------------------------------------*/
.navbar{
	min-width:290px;
	font-size:14px;
	font-weight:400;
	text-transform:capitalize;
	padding:20px 0;
	letter-spacing:1px;
	-webkit-transition:all 0.6s;
	-moz-transition:all 0.6s;
	-o-transition:all 0.6s;
	transition:all 0.6s;
	-webkit-backface-visibility:hidden;
}
.navbar-default{
	transition:all 0.6s ease;
	border-color:transparent;
	background-color:transparent;
}
.navbar-fixed-top{
	border-width:0;
}
@media only screen and (max-width:767px){
	.navbar-default{
		border:0px;
		background-color:transparent;
	}
}
@media only screen and (min-width:768px) and (max-width:991px){
	.navbar .container{
		width:auto;
	}
}
@media only screen and (min-width:240px){
	.navbar.past-main{
		background-color:rgba(255, 255, 255, 0.9);
		padding:10px 0;
	}
}

/* ナビ */
.navbar-default .navbar-nav > li > a{
	padding:15px 10px;
	color:#417038; /* スピナッチグリーン */
	-webkit-transition:all 0.5s;
	-moz-transition:all 0.5;
	transition:all 0.5s;
}
.navbar-default .navbar-nav > li > a:hover{
	color:#838D3B; /* ムス */
}
.navbar-default .navbar-nav > .active > a{
	background:transparent;
	color:#417038; /* スピナッチグリーン */
}
.navbar-default .navbar-nav > .active > a:hover,
.navbar-default .navbar-nav > .active > a:focus{
	background:transparent;
	color:#838D3B; /* ムス */
}
.navbar-default .navbar-collapse{
	border-color:transparent;
	background-color:transparent;
}
@media only screen and (max-width:767px){
	.navbar-default .navbar-collapse{
		text-align:center;
		border:0;
		border-color:transparent;
	}
	.navbar-default .navbar-nav{
		margin-top:15px;
		margin-bottom:15px;
		border-bottom:1px solid rgba(255, 255, 255, 1);
	}
	.navbar-default .navbar-nav > li{
		background-color:rgba(255, 255, 255, 0.9);
		border-top:1px solid rgba(255, 255, 255, 1);
	}
	.navbar-default .navbar-nav > li:hover{
		background-color:rgba(252,250,242, 0.7); /* 白練 */

	}
	#baby-hug .navbar-default .navbar-nav > li{
		background-color:rgba(255, 255, 255, 0.7);
	}
	#baby-hug .navbar-default .navbar-nav > li:hover{
		background-color:rgba(255, 255, 255, 0.5);
	}
	.navbar-default.past-main .navbar-nav{
		border-bottom:1px solid rgba(235,225,197,0.5); /* バニラ */
	}
	.navbar-default.past-main .navbar-nav > li{
		border-top:1px solid rgba(235,225,197,0.5); /* バニラ */
	}
	.navbar-default.past-main .navbar-nav > li:hover{
		background-color:rgba(235,225,197,0.1); /* バニラ */
	}
	.navbar-default .navbar-nav > li > a,
	.navbar-default .navbar-nav > li > a:hover{
		color:#417038; /* スピナッチグリーン */
	}
}
@media only screen and (min-width:240px){
	.navbar-default.past-main .navbar-nav > li > a{
		color:#417038; /* スピナッチグリーン */
		-webkit-transition:color 0.5s;
		transition:color 0.5s;
	}
	.navbar-default.past-main .navbar-nav > li > a:hover{
		color:#417038; /* スピナッチグリーン */
	}
	.navbar-default.past-main .navbar-nav > .active > a,
	.navbar-default.past-main .navbar-nav > .active > a:hover,
	.navbar-default.past-main .navbar-nav > .active > a:focus{
		background:transparent;
		color:#417038; /* スピナッチグリーン */
	}
}
@media only screen and (min-width:768px){
	.navbar-default .navbar-nav{
		background:rgba(255,255,255,0.4);
		border-radius:25px;
		border:1px solid rgba(255,255,255,0.5);
	}
	.navbar-default.past-main .navbar-nav{
		background:rgba(255,255,255,0.9);
		border-color:rgba(235,225,197,0.5); /* バニラ */
	}
	.navbar-default .navbar-nav:first-child{
		padding-left:1em;
	}
	.navbar-default .navbar-nav:last-child{
		padding-right:1em;
	}
}

/* トグル */
.navbar-default .navbar-toggle{
	background:rgba(255,255,255,0.3);
	border-color:rgba(255,255,255,0.8);
	border-radius:3px;
	margin-top:3px;
	margin-bottom:3px;
}
.navbar-default .navbar-toggle:hover,
.navbar-default .navbar-toggle:focus{
	background:rgba(255,255,255,0.1);
}
.navbar-default.past-main .navbar-toggle{
	background:rgba(235,225,197,0.1); /* バニラ */
	border-color:rgba(235,225,197,0.5); /* バニラ */
}
.navbar-default.past-main .navbar-toggle:hover,
.navbar-default.past-main .navbar-toggle:focus{
	background:rgba(255,255,255,1);
}
.navbar-default .navbar-toggle .icon-bar,
.navbar-default .navbar-nav .open .dropdown-toggle{
	color:#417038; /* スピナッチグリーン */
}
@media only screen and (max-width:767px){
	.navbar-default .navbar-toggle .icon-bar{
		background-color:#838D3B; /* ムス */
	}
}

/* ブランドロゴ */
.navbar-default .navbar-brand{
	padding:0 15px;
	color:#417038; /* スピナッチグリーン */
	-webkit-transition:200ms;
	-moz-transition:200ms;
	-o-transition:200ms;
	transition:200ms;
}
.navbar-default .navbar-brand:hover{
	transition:1s;
}
.navbar-default .navbar-brand img{
	height:100%;
	width:auto;
}
@media only screen and (max-width:767px){
	.navbar-default .navbar-brand{
		height:40px;
		line-height:40px;
		color:#FFF;
	}
}
@media only screen and (min-width:240px){
	.navbar-default.past-main .navbar-brand{
		color:#417038; /* スピナッチグリーン */
	}
}


/* ------------------------------------------------------
Main
--------------------------------------------------------*/
#main{
	height:100%;
	background:#FFF;
}
#main img{
	margin:0 auto;
}


/* -------------------------------------------------------
Footer
---------------------------------------------------------*/
.footer{
	width:100%;
	height:100%;
	overflow:hidden;
	background:#FFF;
}
.footer-text p{
	color:#838D3B; /* ムス */
	font-weight:normal;
	line-height:1.4;
	margin:10px 0 20px;
	text-align:center;
}


/* ------------------------------------------------------
Hover Action
--------------------------------------------------------*/
a:hover img.hvr{ /* ロゴhoverの透過を解除 */
	filter:alpha(opacity=100); opacity:1;
}
.navbar .hvr-underline-from-center::before{ /* Navbarのhover */
	height:2px;
	margin:0 15px;
	bottom:10px;
	background:#A0CA5A; /* 萌黄色 */
}
.navbar.past-main .hvr-underline-from-center::before{ /* Navbarのhover */
	background:#A0CA5A; /* 萌黄色 */
}


/* ------------------------------------------------------
Btn Action
--------------------------------------------------------*/
.btn-action{
	background-color:#A0CA5A; /* 萌黄色 */
	border:1px solid #A0CA5A; /* 萌黄色 */
	border-radius:5px;
	color:#FFF;
	line-height:1;
	padding:10px 21px;
	text-transform:uppercase;
	outline:none;
	-webkit-transition:200ms;
	-moz-transition:200ms;
	-o-transition:200ms;
	transition:200ms;
}
.btn-action:hover,
.btn-action:focus,
.btn-action:active,
.btn-action:active:focus{
	background:transparent;
	outline:none;
	color:#A0CA5A; /* 萌黄色 */
	border-color:#A0CA5A; /* 萌黄色 */
	border-color:rgba(160,202,90,10); /* 萌黄色 */
}


/* -------------------------------------------------------
Bact-to-Top
---------------------------------------------------------*/
.back-to-top{
	background:rgba(160,202,90, 0.7); /* 萌黄色 */
	margin:0;
	width:35px;
	height:35px;
	border-radius:50%;
	position:fixed;
	bottom:30px;
	right:30px;
	z-index:90;
	display:none;
	text-decoration:none;
	line-height:35px;
	text-align:center;
	font-size:2rem;
	color:#FFF;
}
.back-to-top i{
	display:inline-block;
	width:35px;
	-webkit-transition:200ms;
	-moz-transition:200ms;
	-o-transition:200ms;
	transition:200ms;
}
.back-to-top:hover{
	background:rgba(160,202,90, 0.9); /* 萌黄色 */
	color:#FFF;
}
.back-to-top:hover i{
	line-height:30px;
}
.back-to-top:focus{
	color:#FFF;
}
.product .back-to-top{
	background:rgba(146, 127, 84, 0.7);
}
.product .back-to-top:hover{
	background:rgba(146, 127, 84, 0.9);
}
@media screen and (max-width:400px){
	.back-to-top{
		right:10px;
	}
}


/*----------------------------------------------------
関連サイト
-----------------------------------------------------*/
#relation{
	width: 100%;
	margin: 0 auto;
	background:#FFF;
}
#relation .relation-content p{
	color:#6D6C69;
	line-height:1.4;
}
#relation .relation-content img{
	width:100%;
}
@media screen and (max-width:991px){ /* 縦並び調整するときここから開始↓↓↓↓↓↓↓↓↓↓↓↓↓ */
	#relation{
		padding:50px 0;
	}
	#relation .logo-group{
		padding:0 28%;
	}
	#relation .logo-group >div{
		padding:20px 0;
	}
	#relation #aoba-logo{ /* 青葉 ロゴ */
		padding-left:0;
		padding-right:0;
	}
	#relation #tocochan-logo{ /* ドットコム ロゴ */
		padding-left:3%;
		padding-right:3%;
	}
	#relation #life-logo{ /* トコ活 ロゴ */
		padding-left:33%;
		padding-right:33%;
	}
}
@media screen and (max-width:767px){
}
@media screen and (max-width:680px){
	#relation .logo-group >div{
		padding:15px 0;
	}
}
@media screen and (max-width:630px){
	#relation .logo-group{
		padding:0 25%;
	}
}
@media screen and (max-width:580px){
	#relation{
		padding:25px 0;
	}
	#relation .logo-group{
		padding:0 22%;
	}
}
@media screen and (max-width:530px){
	#relation .logo-group{
		padding:0 19%;
	}
}
@media screen and (max-width:480px){
	#relation{
		padding:20px 0;
	}
	#relation .logo-group{
		padding:0 16%;
	}
}
@media screen and (max-width:430px){
	#relation .logo-group{
		padding:0 13%;
	}
}
@media screen and (max-width:380px){
	#relation .logo-group{
		padding:0 10%;
	}
}
@media screen and (min-width:992px){ /* 横並び調整するときここから開始↓↓↓↓↓↓↓↓↓↓↓↓↓ */
	#relation{
		padding:50px calc((100% - 970px) / 2);
	}
	#relation .logo-group{
		display:table-row;
	}
	#relation .logo-group >div{
		display:table-cell;
		vertical-align: bottom;
	}

	/* ■■■■■■■■■■ ロゴ3（基本） ■■■■■■■■■■ */
	#relation .container{
		padding:0 10%;
	}
	#relation #aoba-logo{ /* 青葉 ロゴ */
		width:44%;
		padding-right:25px;
	}
	#relation #tocochan-logo{ /* ドットコム ロゴ */
		width:40%;
		padding-left:20px;
		padding-right:20px;
	}
	#relation #life-logo{ /* トコ活 ロゴ */
		width:16%;
		padding-left:25px;
	}
}
@media screen and (min-width:1200px){
	#relation{
		padding:50px calc((100% - 1170px) / 2);
	}

	/* ■■■■■■■■■■ ロゴ3（基本） ■■■■■■■■■■ */
	#relation .container{
		padding:0 17%;
	}
}
