/* =========================================================
   Base
========================================================= */
@font-face {
	font-family: 'Folk';
	src: url('../fonts/A-OTF-FolkPro-Regular.woff') format('woff');
}

html,
body {
	font-family: "メイリオ", Meiryo, "ヒラギノ角ゴ Pro W3",
		HiraginoKakuGothicPro, "ＭＳ Ｐゴシック", sans-serif;
	font-size: 0.9em;
	line-height: 25px;
	color: #525252;
	height: 100%;
	margin: 0;
}

*,
*::before,
*::after {
	box-sizing: border-box;
}

/* =========================================================
   Link Hover Animation
========================================================= */
a {
	transition: 0.3s;
	text-decoration: none;
	color: inherit;
}

a span {
	display: inline-block;
	color: #525252;
}

a:hover span {
	transform: rotateY(360deg);
	transition: 0.6s;
}

a:hover span:nth-of-type(1) { transition-delay: .02s; }
a:hover span:nth-of-type(2) { transition-delay: .04s; }
a:hover span:nth-of-type(3) { transition-delay: .06s; }
a:hover span:nth-of-type(4) { transition-delay: .08s; }
a:hover span:nth-of-type(5) { transition-delay: .10s; }

section {
	background-color: #fff;
	padding: 110px 0 0;
}

ul {
	list-style: none;
}

/* --------------------------------
	ハイライト
-------------------------------- */

::selection{
	background: #5fb3cb;
	color:#fff;
}

::-moz-selection{ /*Firefoxに対応*/
	background: #5fb3cb;
	color:#fff;
}


/* --------------------------------
	line 下線
-------------------------------- */

.c-marker {
	background: -webkit-linear-gradient(left, rgb(255,250,153) 50%, transparent 50%);
	background: -moz-linear-gradient(left, rgb(255,250,153) 50%, transparent 50%);
	background: linear-gradient(left, rgb(255,250,153) 50%, transparent 50%);
	background-repeat: no-repeat;
	background-size: 200% .8em; 
	background-position: 100% .5em;
	transition: 2s;
}

.c-marker.is-active{
	background-position: 0% .5em;
}

/* --------------------------------
	アニメーション　動き
-------------------------------- */

.inviewfadeInUp {/*フェードインしながら上へスライド */
	opacity: 0;
	transform: translate(0, 300px);
	-webkit-transform: translate(0, 300px);
	transition: 10s;
}

.fadeInUp {
	opacity: 1.0;
	transform: translate(0, 0);
	-webkit-transform: translate(0, 0);
}

.inviewUp { /*上へスライド */
	transform: translate(0, 50px);
	-webkit-transform: translate(0, 50px);
	transition: 5s;
}

.Up {
	transform: translate(0, 0);
	-webkit-transform: translate(0, 0);
}

.fuwafuwa {/*上下に動くアニメーション */
	-webkit-animation-name:fuwafuwa;
	-webkit-animation-duration:4s;
	-webkit-animation-iteration-count:infinite;
	/*-webkit-animation-direction:alternate;*/
	-webkit-animation-timing-function:ease;

	-moz-animation-name:fuwafuwa;
	-moz-animation-duration:4s;
	-moz-animation-iteration-count:infinite;
	/*-moz-animation-direction:alternate;*/
	-moz-animation-timing-function:ease;
}

@-webkit-keyframes fuwafuwa {
	0% {-webkit-transform:translate(0, 0);}
	50% {-webkit-transform:translate(0, -15px);}
	100% {-webkit-transform:translate(0, 0);}
}
@-moz-keyframes fuwafuwa {
	0% {-moz-transform:translate(0, 0);}
	50% {-moz-transform:translate(0, -15px);}
	100% {-moz-transform:translate(0, 0);}
}

/*====== 9-1-1 縦線が動いてスクロールを促す =======*/

/*マウススクロールダウン全体の場所*/
.scrolldown1{
	/*描画位置※位置は適宜調整してください*/
	position:absolute;
	right:2.7%;
	bottom:25px;
	/*全体の高さ*/
	height:50px;
}

/*Scrollテキストの描写*/
.scrolldown1 span{
	/*描画位置*/
	position: absolute;
	left:-13px;
	top: -33px;
	/*テキストの形状*/
	color: #fff;
	font-size: 0.8rem;
	letter-spacing: 0.06em;
	writing-mode: vertical-rl;
	-ms-writing-mode: tb-rl;
	-webkit-writing-mode:vertical-rl;
}

/* 線の描写 */
.scrolldown1::after{
	content: "";
	/*描画位置*/
	position: absolute;
	top: 0;
	/*線の形状*/
	width: 1px;
	height: 30px;
	background: #fff;
	/*線の動き1.4秒かけて動く。永遠にループ*/
	animation: pathmove 1.5s ease-in-out infinite;
	opacity:0;
}

/*高さ・位置・透過が変化して線が上から下に動く*/
@keyframes pathmove{
	0%{
		height:0;
		top:0;
		opacity: 0;
	}
	30%{
		height:30px;
		opacity: 1;
	}
	100%{
		height:0;
		top:50px;
		opacity: 0;
	}
}

/* ipad用 */

/*スクロールダウン全体の場所*/
.ipad .scrolldown1{
		/*描画位置※位置は適宜調整してください*/
	position:absolute;
	left:50%;
	bottom:7px;
		/*全体の高さ*/
	height:50px;
}

/*Scrollテキストの描写*/
.ipad .scrolldown1 span{
	/*描画位置*/
	position: absolute;
	left:-15px;
	top: -21px;
	/*テキストの形状*/
	font-size: 1.2rem;
	letter-spacing: 0.05em;
	writing-mode: horizontal-tb;
	-ms-writing-mode: tb-rl;
	-webkit-writing-mode:horizontal-tb;
}

/* 線の描写 */
.ipad .scrolldown1::after{
	position: absolute;
	left: 10px;

}

/*========= 流れるテキスト ===============*/

/*全共通*/

.slide-in {
	overflow: hidden;
		display: inline-block;
}

.slide-in_inner {
	display: inline-block;

}

/*左右のアニメーション*/
.leftAnime{
		opacity: 0;/*事前に透過0にして消しておく*/
}

.slideAnimeLeftRight {
	animation-name:slideTextX100;
	animation-duration:1.8s;
	animation-fill-mode:forwards;
		opacity: 0;
}

@keyframes slideTextX100 {
	from {
	transform: translateX(-100%); /*要素を左の枠外に移動*/
				opacity: 0;
	}

	to {
	transform: translateX(0);/*要素を元の位置に移動*/
		opacity: 1;
	}
}

.slideAnimeRightLeft {
	animation-name:slideTextX-100;
	animation-duration:1.8s;
	animation-fill-mode:forwards;
		opacity: 0;
}


@keyframes slideTextX-100 {
	from {
	transform: translateX(100%);/*要素を右の枠外に移動*/
		opacity: 0;
	}

	to {
	transform: translateX(0);/*要素を元の位置に移動*/
		opacity: 1;
	}
}

/* --------------------------------
	loader ローディング
-------------------------------- */

#loader-bg {
	display: none;
	position: fixed;
	width: 100%;
	height: 100%;
	top: 0px;
	left: 0px;
	z-index: 999;
	overflow: visible !important;
	background-image: radial-gradient( circle farthest-corner at 10% 20%,  rgba(248,219,219,1) 0%, rgba(229,248,250,1) 90% );
}

#loader {
	display: none;
	position: fixed;
	top: 50%;
	left: 50%;
	width: 200px;
	height: 200px;
	margin-top: -80px;
	margin-left: -100px;
	text-align: center;
	color: #fff;
	z-index: 3;
}

#loader p{
	font-family: 'Poiret One', cursive;
	margin-top: 20px;
}

/* --------------------------------
	title 見出し
-------------------------------- */

h1,
h2,
h3
 {
	font-family: 'Folk', sans-serif;
	color: #525252;
}

.title {
	margin-bottom: 40px;
}

.title span {
	display: block;
	font-family: 'Raleway', sans-serif;
	color: #728365;
	margin-bottom: 20px;
	font-weight: 600;
	letter-spacing: 0.3em;
}

.title p {
	letter-spacing: 0.1em;
}

h2 {
	letter-spacing: 0.1em;
	position: relative;
	text-align: center;
}
h2::before {
	position: absolute;
	top: 50%;
	left: 23%;
	content: '';
	display: block;
	width: 13%;
	height: 1px;
	background-color: #525252;
}
h2::after {
	position: absolute;
	top: 50%;
	right: 23%;
	content: '';
	display: block;
	width: 13%;
	height: 1px;
	background-color: #525252;
}

.ipad h2::before {
	position: absolute;
	left: 12%;
	width: 17%;
}

.ipad h2::after {
	position: absolute;
	right: 12%;
	width: 17%;
}


/* --------------------------------
	button ボタン
-------------------------------- */

.btn-common { /*トップ*/
	font-size: 1.1em;
	color: #fff;
	border-radius:0;
	font-weight: 300;
	padding: 17px 85px;
	transform: translateZ(0);
	backface-visibility: hidden;
	background-color: #e77e7e;
	letter-spacing: 0.1em;
	margin-left: 30px;
}

.btn-common:hover,
.btn-common:focus {
	outline: none;
	background: #4495b3;
	box-shadow: none;
	color: #fff;
	animation-name: btn-common;
	animation-duration: 0.5s;
	animation-timing-function: linear;
	animation-iteration-count: 1;
}


.btn-common2 { /*オープニング*/
	font-size: 1em;
	color: #525252;
	border: 1px solid #525252;
	border-radius:0;
	font-weight: 300;
	padding: 16px 45px;
	position: relative;
	margin-top: 20px;
	transform: translateZ(0);
	backface-visibility: hidden;
	background-color: rgba(255, 255, 255,0.4);
	letter-spacing: 0.1em;
}

.btn-common2:hover,
.btn-common2:focus {
	outline: none;
	background: #e77e7e;
	box-shadow: none;
	color: #fff;
	border-color: #e77e7e;
	animation-name: btn-common;
	animation-duration: 0.5s;
	animation-timing-function: linear;
	animation-iteration-count: 1;
}

.btn-common3 { /*リセットボタン*/
	font-size: 1em;
	color: #fff;
	border: 1px solid #4495b3;
	border-radius:0;
	font-weight: 300;
	padding: 17px 55px;
	position: relative;
	margin: 20px 7px 35px;
	transform: translateZ(0);
	backface-visibility: hidden;
	background-color: #4495b3;
	letter-spacing: 0.1em;
	display: inline-block;
	width: 250px;
}

.btn-common3:hover,
.btn-common3:focus {
	outline: none;
	background: #54abcb;
	box-shadow: none;
	color: #fff;
	border-color: #54abcb;
	animation-name: btn-common;
	animation-duration: 0.5s;
	animation-timing-function: linear;
	animation-iteration-count: 1;
}

.btn-common4 { /*確認ボタン*/
	font-size: 1em;
	color: #fff;
	border: 1px solid #c75051;
	border-radius:0;
	font-weight: 300;
	padding: 17px 55px;
	position: relative;
	margin: 20px 7px 35px;
	transform: translateZ(0);
	backface-visibility: hidden;
	background-color: #c75051;
	letter-spacing: 0.1em;
	display: inline-block;
	width: 250px;
}

.btn-common4:hover,
.btn-common4:focus {
	outline: none;
	background: #df6061;
	box-shadow: none;
	color: #fff;
	border-color: #df6061;
	animation-name: btn-common;
	animation-duration: 0.5s;
	animation-timing-function: linear;
	animation-iteration-count: 1;
}

.btn-common5 { /*具体的に...のところに使用*/
	font-size: 1em;
	color: #525252;
	border: 1px solid #525252;
	border-radius:0;
	font-weight: 300;
	padding: 14px 25px;
	position: relative;
	margin-top: 20px;
	transform: translateZ(0);
	backface-visibility: hidden;
	background-color: rgba(255, 255, 255,0.4);
	letter-spacing: 0.1em;
}

.btn-common5:hover,
.btn-common5:focus {
	outline: none;
	background: #e77e7e;
	box-shadow: none;
	color: #fff;
	border-color: #e77e7e;
	animation-name: btn-common;
	animation-duration: 0.5s;
	animation-timing-function: linear;
	animation-iteration-count: 1;
}

.btn-common6 { /*MORE*/
	color: #525252;
	border: 1px solid #1e1e1e;
	border-radius:0;
	font-size: 0.8em;
	padding: 6px 20px;
	position: relative;
	margin-top: 17px;
	transform: translateZ(0);
	backface-visibility: hidden;
	letter-spacing: 0.1em;
}

.btn-common6:hover,
.btn-common6:focus {
	outline: none;
	background: #4495b3;
	box-shadow: none;
	color: #fff;
	border-color: #4495b3;
	animation-name: btn-common;
	animation-duration: 0.5s;
	animation-timing-function: linear;
	animation-iteration-count: 1;
}

@keyframes btn-common {
	from,
	to {
		-webkit-transform: scale(1, 1);
		transform: scale(1, 1);
	}
	25% {
		-webkit-transform: scale(0.9, 1.1);
		transform: scale(0.9, 1.1);
	}
	50% {
		-webkit-transform: scale(1.1, 0.9);
		transform: scale(1.1, 0.9);
	}
	75% {
		-webkit-transform: scale(0.95, 1.05);
		transform: scale(0.95, 1.05);
	}
	from,
	to {
		-webkit-transform: scale(1, 1);
		transform: scale(1, 1);
	}
	25% {
		-webkit-transform: scale(0.9, 1.1);
		transform: scale(0.9, 1.1);
	}
	50% {
		-webkit-transform: scale(1.1, 0.9);
		transform: scale(1.1, 0.9);
	}
	75% {
		-webkit-transform: scale(0.95, 1.05);
		transform: scale(0.95, 1.05);
	}
}


/* --------------------------------
	アイコン
-------------------------------- */

.fa-angle-down {
	padding-left: 5px;
}

.fa-angle-down{
	padding-right: 8px;
}

.fa-folder-open{
	padding-top: 14px;
}

.fa-tags{
	padding-right: 8px;
}


/* --------------------------------
	Header　ヘッダー
-------------------------------- */

header {
	height: 100%;
}

#particles{
	opacity: 0.3;
	width: 100%;
	height: 100%;
	overflow: hidden;
}

.header_wrapper {
	width: 100%;
	height: 100%;
	text-align: center;
}

.header_wrapper .brand {
	display: none;
}

.header {
	position: absolute;
	top: 0;
	left: 0;
	width: 100%;
	height: 100%;
	bottom: 0;
}

.header_inner {
	margin: 0 auto;
}

.ipad .header_inner {
	margin-left: 30px;
	margin-top: 160px;
}

.header_inner h2 {
	display: none;
}


.header_inner .main-title {
	position: absolute;
	top: 30%;
	left: 51%;
	-webkit-transform: translate(-50%, -50%); /* Safari用 */
	transform: translate(-50%, -50%);
	font-family: 'Cormorant', serif;
	font-size: 7.2em;
	color: #fff;
	font-weight: bold;
	letter-spacing: 0.09em;
	/*background-color: rgba(0,0,0,0.15);*/
	line-height: 140px;
	/*width: 100%;*/
	text-shadow: 1px 1px 70px #696969;
}

.header_inner .main-title .t-name{
	font-size: 0.9em;
	margin-left: -13px;
	/*opacity: 0.9;*/
}

.header_inner .main-title .adj3{
	font-size: 0.45em;
	position: relative;
	top: -11px;
}

.ipad .header_inner .main-title {
	position: absolute;
	top: 33%;
	left: 50%;
	-webkit-transform: translate(-50%, -50%); /* Safari用 */
	transform: translate(-50%, -50%);
	font-family: 'Cormorant', serif;
	font-size: 7.4em;
	color: #fff;
	font-weight: bold;
	letter-spacing: 0.1em;
	line-height: 65px;
	width: 47%;
	padding: 40px 0 55px;
	width: 85%;
}

.header_inner .sub_title_top {
	position: absolute;
	top: 16%;
	left: 50.3%;
	-webkit-transform: translate(-50%, -50%); /* Safari用 */
	transform: translate(-50%, -50%);
	font-size: 1.5em;
	color: #fff;
	letter-spacing: 0.2em;
	font-family: 'Folk';
	text-shadow: 1px 1px 70px #525252;
}

.header_inner .sub_title_bottom {
	font-size: 1.5em;
	color: #fff;
	letter-spacing: 0.3em;
	font-family: 'Folk';
	text-shadow: 1px 1px 70px #525252;
	position: absolute;
	top: 55%;
	left: 51%;
	-webkit-transform: translate(-50%, -50%); /* Safari用 */
	transform: translate(-50%, -50%);
}

.ipad .header_inner .sub_title_top {
	position: absolute;
	top: 17%;
	left: 50%;
	-webkit-transform: translate(-50%, -50%); /* Safari用 */
	transform: translate(-50%, -50%);
	font-size: 1.4em;
	color: #fff;
	letter-spacing: 0.2em;
	font-family: 'Folk';
	/*text-shadow: 1px 1px 50px #2f2d2d;*/
	width: 100%;
}

.ipad .header_inner .sub_title_bottom {
	font-size: 1.5em;
	color: #fff;
	letter-spacing: 0.3em;
	font-family: 'Folk';
	/*text-shadow: 1px 1px 50px #2f2d2d;*/
	position: absolute;
	top: 61%;
	left: 51%;
	-webkit-transform: translate(-50%, -50%); /* Safari用 */
	transform: translate(-50%, -50%);
	width: 100%;
}

.header_inner .top_btn{
	position: absolute;
	top: 72%;
	left: 41%;
	margin: 0 auto;
	-webkit-transform: translate(-50%, -50%); /* Safari用 */
	transform: translate(-50%, -50%);
}

.header_inner .top_btn_sp{
	position: absolute;
	top: 73%;
	left: 19%;
}


.ipad .header_inner .top_btn_sp{
	position: absolute;
	top: 70%;
	left: 32%;
}

#logo {
	z-index: 999;
	position: relative;
	width: 100%;
	text-align: center;
	top: -80px;
	left: 0;
}

.home_top{
	position:absolute;
	left:1.5%;
	top: 29%;
	cursor: pointer;
	letter-spacing:0.1em;
	writing-mode: vertical-rl;
	-ms-writing-mode: tb-rl;
	-webkit-writing-mode:vertical-rl;
	color: #fff;
	font-size: 1em;
	text-align: left;
}

.ipad .home_top{
	font-size: 1.2em;
	font-weight: 200;
	opacity: 0.9;
}

.home_top a{
	color: #fff;
	text-decoration: none;
}


/* --------------------------------
	nav
-------------------------------- */


#navg h2 {
	display: none;
}

#navg {
	width: 100%;
	margin: 0;
	text-align: center;
	background-color: rgba(255, 255, 255, 0);
	-webkit-transition: background-color 700ms linear;
	-moz-transition: background-color 700ms linear;
	-o-transition: background-color 700ms linear;
	-ms-transition: background-color 700ms linear;
	transition: background-color 700ms linear;
}

#sakura-toggle {
	float: none;
}

.navbar-toggle {
	padding: 12px 0 12px 8px;
}

#navg ul li a {
	font-family: 'Raleway', sans-serif;
	text-decoration: none;
	font-size: 1em;
	letter-spacing: .15em;
	line-height: 78px;
	color: #fff;
	margin: 0 0 0 30px;
	position: relative;
	left: -13px;
}

.ipad #navg ul li a { /*ipad*/
	margin: 0 6px;
	position: relative;
	left: -1px;
}

#navg ul li a:hover {
	color: #f38585;
	background-color: rgba(255, 255, 255, 0);
}

#navg ul li a:focus {
	color: #f38585;
	background-color: rgba(255, 255, 255, 0);
}


.fixed {
	position: fixed !important;
	top: 0 !important;
	z-index: 3 !important;
	background-color: rgba(255, 255, 255, 1)!important;
	border-bottom: 1px solid #dcdcdc !important;
}

.fixed ul li a {
	color: black !important;
}


@media screen and ( min-width:768px) {
	#navg {
		height: 100px;
		position: absolute;
		bottom: 0;
		text-align: center;
	}
	#navg ul li {
		display: inline-block;
	}
}

@media screen and ( max-width:767px) {
	#navg {
		position: fixed;
		width: 100%;
		top: 0;
		z-index: 3;
		background-color: #fff;
		border-bottom: 1px solid #dcdcdc;
	}
	#navg ul li {
		background-color: #f38585;
		padding: 4px 0;
		margin: 0;
		border-bottom: 1px solid #fff;
	}
	#navg ul li a {
		color: #fff;
		padding: 10px 0;
	}
	#navg ul li a:hover {
		color: #fff;
		background: #3cafb7;
		margin: 0;
		padding: 10px 0;
		position:relative;
		left: 0;
	}
}

/* --------------------------------
	opening 最初の言葉
-------------------------------- */

#opening {
	padding:120px 0 0;
}

#opening h2 {
	display: none;
}

.opening {
	margin-bottom: 50px;
}

.opening h3 {
	letter-spacing: 0.1em;
	margin-bottom: 40px;
	font-size: 2.5em;
}

.opening p {
	letter-spacing: 0.1em;
	line-height: 30px;
}


/* --------------------------------
	service サービス
-------------------------------- */

.box{
	transition:all 1s ease;
	border:0.1em solid #5b5b5b;
	/*border-radius:4px;*/
	padding:80px 90px;
	margin-bottom: 20px;
	background-color:#fff;
	background: -webkit-linear-gradient(180deg, #fff2f6 20%, #effffd 80%);
	background: -moz-linear-gradient(180deg, #fff2f6 20%, #effffd 80%);
	background: -ms-linear-gradient(180deg, #fff2f6 20%, #effffd 80%);
	background: -o-linear-gradient(180deg, #fff2f6 20%, #effffd 80%);
	background: linear-gradient(180deg, #fff2f6 20%, #effffd 80%);

	-webkit-transition: all 370ms cubic-bezier(0.34, 1.61, 0.7, 1);
	-moz-transition: all 370ms cubic-bezier(0.34, 1.61, 0.7, 1);
	-o-transition: all 370ms cubic-bezier(0.34, 1.61, 0.7, 1);
	-ms-transition: all 370ms cubic-bezier(0.34, 1.61, 0.7, 1);
	transition: all 370ms cubic-bezier(0.34, 1.61, 0.7, 1);
}

.box:hover {
	-webkit-transform: scale(1.03);
	-moz-transform: scale(1.03);
	-o-transform: scale(1.03);
	-ms-transform: scale(1.03);
	transform: scale(1.03);
	box-shadow: 0 15px 5px -10px rgba(0, 0, 0, 0.1), 0 10px 15px 0px rgba(0, 0, 0, 0.1), 0 15px 10px -10px rgba(0, 0, 0, 0.1);
}

.box-content{
	cursor : pointer;
}

hr{
	border-bottom: 1px solid #525252;
	margin: 0 0 10px;
}


.box-content h3{
	letter-spacing: 0.15em;
	font-size: 1.8em;
}

.remodal h3{
	font-size: 2.1em;
	text-align: left;
	margin-bottom: 0;
}

.remodal .ico{
	margin:0 17px 13px 0;
}

/* --------------------------------
	features 特徴
-------------------------------- */

.features {
	padding-top: 90px;
	padding-bottom: 55px;
	background-image: url(../images/features_bg.jpg);
	background-color: #f4f4f4;
}

.features h3{
	font-size: 2em;
	position: relative;
	left: -5px;
	top: -8px;
}

.features .features_wrapper .item {
	margin-bottom: 50px;
	background: #fff;
	padding: 30px 50px;
	padding-left: 90px;
	-webkit-border-radius: 4px;
	-moz-border-radius: 4px;
	-ms-border-radius: 4px;
	-o-border-radius: 4px;
	border-radius: 4px;
	-moz-background-clip: padding;
	-webkit-background-clip: padding-box;
	background-clip: padding-box;
	position: relative;
}

.ipad .features .features_wrapper .item {

}

.features .features_wrapper .item p {
	letter-spacing: 0.1em;
}

.features .features_wrapper .item .img_left{
	position:absolute;
	left:-280px;
	top: -47px;
}

.features .features_wrapper .item .img_right{
	position:absolute;
	left:710px;
	top: 280px;
	z-index: -1;
}


.win .features .features_wrapper .item .sakura_left{
	position:absolute;
	top:-150px;
	left: -350px;
}

.features .features_wrapper .date-badge {
	position: absolute;
	left: -10px;
	top: 30px;
	width: 60px;
	background: #4495b3;
	color: #fff;
	display: block;
	padding-top: 10px;
	padding-bottom: 10px;
	text-align: center;
	font-weight: bold;
}

.features .features_wrapper .date-badge span {
	display: block;
	line-height: 1.2;
}

.features .features_wrapper .date-badge:before {
	content: "";
	display: block;
	width: 0;
	height: 0;
	border-left: 20px solid transparent;
	border-right: 20px solid transparent;
	border-top: 20px solid #2f6b8a;
	position: absolute;
	left: 0;
	bottom: -20px;
}

.features .features_wrapper .date-badge:after {
	content: "";
	display: block;
	background: #fff;
	position: absolute;
	left: 10px;
	bottom: -20px;
	width: 50px;
	height: 20px;
}

.number {
	font-size: 2.3em;
	font-family: 'Josefin Sans', sans-serif;
	position: relative;
	top: 0.1em;
	color: #fff;
}


/* --------------------------------
	staff スタッフ
-------------------------------- */

.staff {
	max-height: 600px;
}

.staff .staff-img img {
	text-align: center;
	transition: all .3s ease;
	-webkit-transition: all .3s ease;
	-moz-transition: all .3s ease;
}

.staff-details {
	position: relative;
	background-color: #fff;
	padding-top: 20px;
	bottom: 0;
	margin-bottom: 30px;
}

.staff p{
	text-align: justify;
	text-justify: inter-ideograph;
	padding:15px 20px 20px;
	line-height: 23px;
	letter-spacing: 0.1em;
	-webkit-box-shadow: 1px 1px 1px 0px rgba(0, 0, 0, .1);
	-moz-box-shadow: 1px 1px 1px 0px rgba(0, 0, 0, .1);
	-ms-box-shadow: 1px 1px 1px 0px rgba(0, 0, 0, .1);
	-o-box-shadow: 1px 1px 1px 0px rgba(0, 0, 0, .1);
	box-shadow: 1px 1px 1px 0px rgba(0, 0, 0, .3);
}


.staff .person-name {
	font-family: "メイリオ",Meiryo,"ヒラギノ角ゴ Pro W3",HiraginoKakuGothicPro,"ＭＳ Ｐゴシック",sans-serif;
	font-size: 1.5em;
	letter-spacing: 0.1em;
	display: block;
	padding:0 0 7px;
	margin: 11px 0 0;
}

.staff .person-name-en{
	font-family: 'Raleway', sans-serif;
	letter-spacing: 0.1em;
}

.staff .person-post {
	letter-spacing: 0.1em;
	color: #728365;
}


/* --------------------------------
	contact 住所
-------------------------------- */

#contact{
	padding-bottom: 30px;
}

.contact{
	display: block;
}

.contact .mail{
	color: #525252;
}

.contact .ico{
	margin-bottom: 25px;
}

.contact h3 {
	display: none;
}

.map_wrapper {
	min-width: 280px;
	margin: 50px auto 35px;
	padding: 5px;
	border: 1px solid #dcdcdc;
}

.googlemap {
	position: relative;
	padding-bottom: 56.25%;
	height: 0;
	overflow: hidden;
}

.googlemap iframe {
	position: absolute;
	top: 0;
	left: 0;
	width: 100% !important;
	height: 100% !important;
}

.adj{
	margin-bottom: 70px;
}

.adj2{
	position: relative;
	top: 15px;
}


/* --------------------------------
	pagetop　トップページ
-------------------------------- */

.pagetop {
	display: none;
	position: fixed;
	bottom: 30px;
	right: 20px;
}


/* --------------------------------
	footer　フッター
-------------------------------- */

#footer {
	width: 100%;
	padding: 40px 0 30px;
	background-image: url(../images/features_bg.jpg);
	display: grid;
	grid-template-rows: auto 1fr auto;
	grid-template-columns: 100%;
}

.f_sakura{
	position: absolute;
	margin-top: -190px;
	margin-left: 10px;
}

.footer .kikan{
	margin-bottom: 10px;
	line-height: 25px;
	color: #a4a4a4;
}

.footer .logo{
	width: 160px;
	margin: 10px;
	display: inline-block;
}

.footer .logo img{
	cursor: pointer;
	transition-duration: 0.4s;
}
.footer .logo:hover img{
	opacity: 0.6;
	transition-duration: 0.4s;
}

.footer .copyright {
	color: #a4a4a4;
	text-align: center;
	margin-top: 10px;
	letter-spacing: 0.07em;
}

.footer .social{
	margin-top: 11px;
	padding-top:1.5em;
	border-top: 1px solid #c2c2c2;
	text-align: center;
}

.footer .social a {
	margin:0 3px;
	width:30px;
	height: 30px;
	line-height: 32px;
	font-size:15px;
	display: inline-block;
	text-align: center;
	position: relative;
	color:#cccccc;
	z-index: 1;
	text-decoration: none;
}

.footer .social a:before {
	content:' ';
	z-index:-1;
	border-radius:50%;
	transition:all 0.15s ease;
	position:absolute;
	width:0; height:0;
	top:50%;
	left:50%;
	background:black;
}

.footer .social a:hover {
	color:white;
}

.footer .social a:hover:before {
	width:100%;
	height:100%;
	top:0; left:0;
}

.footer .social a:active:before {
	width:200%;
	height: 200%;
	opacity: 0;
	top:-50%;
	left:-50%;
}

.footer .social a.facebook:before {background:#3b5998;}
.footer .social a.twitter:before {background:#55acee;}
.footer .social a.stone:before {background:#c8ac2c;}
.footer .social a.dribbble:before {background:#3e9499;}
.footer .social a.home:before {background:#06863c;}
.footer .social a.flat:before {background:#001a64;}


.footer .social a.facebook:active {color:#3b5998;}
.footer .social a.twitter:active {color:#55acee;}
.footer .social a.stone:active {color:#c8ac2c;}
.footer .social a.dribbble:active {color:#3e9499;}
.footer .social a.home:active {color:#06863c;}
.footer .social a.flat:active {color:#001a64;}


#contact .form-group {
	margin-bottom:32px;
	font-family: 'Raleway', sans-serif;
}

#contact .form-group input,
#contact .form-group textarea {
	padding: 20px;
}

#contact .form-group input.form-control {
	height: auto;
}

#contact .form-group textarea.form-control {
	height: 250px;
}

#contact .form-control:focus {
	border-color: #d5ebf2;
	box-shadow: none;
	transition: background-color 0.5s;
	background-color: #e0f0f5;
}

#contact input:checked + label{
	background: #ffed4d;
}

.adj2{
	margin-left: 5px;
}