@charset "UTF-8";
*{
	-webkit-box-sizing: border-box;
	-moz-box-sizing: border-box;
	-o-box-sizing: border-box;
	-ms-box-sizing: border-box;
	box-sizing: border-box;
	color:#566871;
	font-family: "fot-cezanne-pron", sans-serif;
	font-weight: 500;
	font-style: normal;
	letter-spacing:0.2em;
}
/*html {
  visibility: hidden;
}
html.wf-active {
  visibility: visible;
}*/
img{
	max-width:100%;
	height:auto;
}
a{
	transition: all 0.3s ease 0s;
	text-decoration:none;
}
a:hover{
	/*filter: alpha(opacity=60);*/
	/*-moz-opacity:0.6;*/
	/*opacity:0.6;*/
}
a.cover{
	position:absolute;
	display:block;
	height:100%;
	width:100%;
	top:0;
	left:0;
	z-index:2;
}
.bold{
	font-weight:bold;
}
a.cover:hover{
	background:rgba(256,256,256,0.4);
}
.inline-block{
	display:inline-block;
}
.mar_t_10{
	margin-top:10px;
}
.mar_t_20{
	margin-top:20px;
}
.mar_t_30{
	margin-top:30px;
}
.mar_t_40{
	margin-top:40px;
}
.mar_b_0{
	margin-bottom:0px;
}
.mar_b_5{
	margin-bottom:5px;
}
.mar_b_10{
	margin-bottom:10px;
}
.mar_b_20{
	margin-bottom:20px;
}
.mar_b_30{
	margin-bottom:30px;
}
.mar_b_40{
	margin-bottom:40px;
}
.mar_b_50{
	margin-bottom:50px;
}
.mar_b_60{
	margin-bottom:60px;
}
.mar_b_70{
	margin-bottom:70px;
}
.mar_b_80{
	margin-bottom:80px;
}
.mar_b_90{
	margin-bottom:90px;
}
.mar_b_100{
	margin-bottom:100px;
}
.mar_b_110{
	margin-bottom:110px;
}
.mar_b_120{
	margin-bottom:120px;
}
.mar_b_130{
	margin-bottom:130px;
}
.mar_b_140{
	margin-bottom:140px;
}
.mar_b_150{
	margin-bottom:150px;
}
.mar_b_160{
	margin-bottom:160px;
}
.mar_b_170{
	margin-bottom:170px;
}
.mar_b_180{
	margin-bottom:180px;
}
.mar_b_200{
	margin-bottom:200px;
}
.f_l{
	float:left;
}
.f_r{
	float:right;
}
.basic_text{
	font-size:15px;
	letter-spacing:0.16em;
	line-height:1.9;
}
.text-center{
	text-align:center;
}
.text-right{
	text-align:right;
}
.text-left{
	text-align:left;
}
.pc_on{
	display:block;
}
img.pc_on{
	display:inline-block;
}
.sp_on{
	display:none;
}
img.sp_on{
	display:none;
}

.relative{
	position:relative;
}
table{
}
.center_center{
	position: absolute;
	top: 50%;
	left: 50%;
	-moz-transform: translate(-50%, -50%);
	-ms-transform: translate(-50%, -50%);
	-webkit-transform: translate(-50%, -50%);
	transform: translate(-50%, -50%);
}
body{
	overflow-x:hidden;
	width:100%;
	position:relative;
}
.inner{
	max-width:100%;
	width:1040px;
	margin:auto;
}
h1{
	text-align:center;
}
h2{
	text-align:center;
}
h3{
	text-align:center;
}
.flex{
	display:flex;
}


/*********ここまでよく使う初期css　それ以外はこれ以降に自由に記述*********/
.wrapper{
	width:100%;
	height:100vh;
	display:flex;
}
.wrapper .left{
	width:50%;
	height:100vh;
	display:flex;
	align-items:center;
	justify-content:center;
	position:relative;
	background:#FFF;
	border:10px solid #cc231b;
	box-shadow:0 0px 20px rgba(186,162,131,1);
}
.wrapper .left a{
	width:213px;
	position: absolute;
	bottom: 100px;
	left: 50%;
	transform: translate(-50%, 0%);
	background:#d8cfc1;
	color:#fff;
	text-align:center;
	font-size:14px;
	letter-spacing:0.14em;
	padding:12px;
	border-radius:19px;
}

.wrapper .left h1{
	padding-bottom:100px;
}
.wrapper .left h1 img{
	width:280px;
	height:auto;
}
.wrapper .right{
	width:50%;
	height:100vh;
	background:#e3dcd3;
	overflow-y:scroll;
}
.wrapper .right .inner{
	width:800px;
	padding:60px 50px 110px;
}
.wrapper .right .inner h2{
	font-family: "brandon-grotesque", sans-serif;
	font-weight: 600;
	font-style: normal;
	font-size:43px;
	color:#566871;
	letter-spacing:0.14em;
	margin-bottom:90px;
}
.box{
	border-top:1px dashed #FFF;
	border-bottom:1px dashed #c0b2a0;
	padding:30px 0 40px;
}
.box.first{
	border-top:0px dashed #FFF;
	padding:0px 0 40px;
}
.sp_btn{
	display:none;
}
.flex_title{
	display:flex;
	width:100%;
	justify-content:space-between;
	align-items:center;
	margin-bottom:20px;
}
.flex_title .title{
	display:flex;
	width:calc(100% - 213px);
	align-items:center;
}
.flex_title .title p{
	font-size:24px;
	letter-spacing:0.14em;
}
.flex_title .title .icon{
	margin-right:15px;
}
.flex_title .title .icon img{
	height:37px;
	width:auto;
}
.basic_text{
	font-size:14px;
	letter-spacing:0.14em;
}
.footer{
	border-top:1px dashed #FFF;
	padding-top:30px;
	display:flex;
	width:100%;
	justify-content:space-between;
	align-items:center;
}
.footer > img{
	width:calc(100% - 228px);
	margin-right:15px;
}
.footer a.btn{
	background:#6a775e;
}
.box a.btn{
	background:#b1a08a;
}
a.btn{
	width:213px;
	color:#fff;
	text-align:center;
	font-size:14px;
	letter-spacing:0.14em;
	padding:12px;
	border-radius:19px;
	display:block;
}
.load-1{
	background:#cc231b;
	width:100%;
	height:100vh;
	transform: translate(0, 0);
	transition: transform cubic-bezier(0.215, 0.61, 0.355, 1) .6s;
	position:fixed;
	top:0;
	left:0;
	z-index:100;
}
.load-2{
	/*background:#c7baa6;*/
	background:#FFF;
	width:100%;
	height:100vh;
	transform: translate(0, 0);
	transition: transform cubic-bezier(0.215, 0.61, 0.355, 1) .6s;
	position:fixed;
	top:0;
	left:0;
	z-index:101;
}
.load-1.loaded{
	transform: translate(0, 100vh);
	transition: transform cubic-bezier(0.215, 0.61, 0.355, 1) .6s;
}
.load-2.loaded{
	transform: translate(0, 100vh);
	transition: transform cubic-bezier(0.215, 0.61, 0.355, 1) .6s;
}
/***アニメ***/
.effect-fade.center_center {
	transform : translate(-50%, 25px);
}
.effect-fade {
	opacity : 0;
	transform : translate(0, 25px);
	transition : all 2000ms;
}
.effect-fade.effect-scroll {
	opacity : 1;
	transform : translate(0, 0);
}
.center_center.effect-fade.effect-scroll{
	opacity : 1;
	transform : translate(-50%, -50%);
}
.flex_title .title p{
  display: flex;
  overflow: hidden;
  color: #aa8f7b;
  font-family: 'Josefin Sans', sans-serif;
}

.flex_title .title p span {
  display: block;
  transform: translate(0, 105%);
  transition: transform cubic-bezier(0.215, 0.61, 0.355, 1) 0.5s;
}

.flex_title .title p.effect-scroll span {
  transform: translate(0, 0);
}

.flex_title .title p span:nth-child(2) {
  transition-delay: 0.06s;
}
.flex_title .title p span:nth-child(3) {
  transition-delay: 0.12s;
}
.flex_title .title p span:nth-child(4) {
  transition-delay: 0.18s;
}
.flex_title .title p span:nth-child(5) {
  transition-delay: 0.24s;
}
.flex_title .title p span:nth-child(6) {
  transition-delay: 0.30s;
}
.flex_title .title p span:nth-child(7) {
  transition-delay: 0.36s;
}
.flex_title .title p span:nth-child(8) {
  transition-delay: 0.42s;
}
.flex_title .title p span:nth-child(9) {
  transition-delay: 0.48s;
}
.flex_title .title p span:nth-child(10) {
  transition-delay: 0.54s;
}
.flex_title .title p span:nth-child(11) {
  transition-delay: 0.6s;
}
.flex_title .title p span:nth-child(12) {
  transition-delay: 0.66s;
}
.flex_title .title p span:nth-child(13) {
  transition-delay: 0.72s;
}
.flex_title .title p span:nth-child(14) {
  transition-delay: 0.78s;
}
/***アニメ***/