@charset "UTF-8";

html {
  font-size: 62.5%
}

body {
  color: #000;
  font-family: "游ゴシック体", YuGothic, "游ゴシック", "Yu Gothic", sans-serif;
  font-size: 1.5rem;
  line-height: 2.2;
  font-weight: 400;
  margin: 0;
  background-color: #e9e9e4;
}
body, html {
  height: 100%
}
img{
	max-width: 100%;
	height: auto;
}
:root {
  --font-en: "Lato", sans-serif;
  --font-serif: "Noto Serif JP", serif;
}
.flex-box{
	display: flex;
	justify-content: space-between;
	flex-wrap: wrap;
	align-items: flex-start;
}
.mv_base {
  opacity: 0;
  transition: 1s;
  transform: translate(0, 20px);
  -webkit-transform: translate(0, 20px);
}
.mv {
  opacity: 1;
  transform: translate(0, 0);
  -webkit-transform: translate(0, 0);
}
.container-wrap{
	max-width: 1260px;
	width: 100%;
	margin: 0 auto;
	padding: 0 30px;
	position: relative;
}
.container-wrap__mid{
	max-width: 1090px;
	width: 100%;
	margin: 0 auto;
	padding: 0 30px;
	position: relative;
}
.container-wrap__small{
	max-width: 710px;
	width: 100%;
	margin: 0 auto;
	padding: 0 30px;
	position: relative;
}
.font-en{
	font-family: "Lato", sans-serif;
}

.text_c{
	text-align: center;
}
.dis-tab{
	display: none;
}
.dis-sp{
	display: none;
}

@media only screen and (max-width: 1199px) {
	
}
@media only screen and (max-width: 991px) {
	body {
	  font-size: 1.4rem;
	  line-height: 2;
	}
}
@media only screen and (max-width: 767px) {
	body {
	  line-height: 1.8;
	}
	.dis-sp{
		display: block;
	}
}


header{
	position: fixed;
	top: 0;
	left: 0;
	width: 100%;
	padding: 20px 60px;
	z-index: 100;
	background-color: #e9e9e4;
}
header .logo{
	width: 208px;
	display: block;
	line-height: 1;
}
.menu-wrap{
	position: absolute;
	right: 60px;
	top: 24px;
	align-items: center;
}
.menu-wrap__gmenu{
	border-right: 1px solid #a7a7a2;
}
.menu-wrap__gmenu li{
	margin-right: 30px;
}
.menu-wrap__gmenu a{
	font-size: 14px;
	transition: .3s;
}
.menu-wrap__gmenu a:hover{
	opacity: .6;
}
.menu-wrap__contact{
	align-items: center;
	padding-left: 30px;
}
.menu-wrap__contact li a{
	line-height: 1;
	align-items: center;
	display: block;
	transition: .3s;
}
.menu-wrap__contact li a:hover{
	opacity: .6;
}
.menu-wrap__contact li:not(:last-child){
	margin-right: 15px;
}
.menu-wrap__contact img{
	width: 20px;
	height: auto;
}
.menu-wrap__contact li:first-child img{
	vertical-align: top;
} 
.menu-wrap__contact span{
	font-size: 24px;
	line-height: 1;
	font-family: var(--font-serif);
	letter-spacing: 0.06rem;
}
.pagenav-wrap{
	display: none;
}
.openbtn{
	display: none;
}
.btn-link{
	width: 280px;
	padding: 22px 0;
	border-radius: 60px;
	text-align: center;
	position: absolute;
	justify-content: center;
	border: 1px solid #91918d;
	align-items: center;
	transition: .3s;
}
.btn-link svg{
	width: 5px;
}
.btn-link__text{
	font-size: 14px;
	line-height: 1;
	padding-left: 10px;
}
.btn-link:hover{
	background-color: #000;
}
.btn-link:hover .btn-link__text{
	color: #fff;
}
.btn-link:hover polygon{
	fill: #fff;
}
.con-title{
	margin-bottom: 30px;
}
.con-title dt{
	font-size: 12px;
	line-height: 1;
	color: #595959;
	font-family: var(--font-en);
}
.con-title dd{
	font-size: 24px;
	line-height: 1;
	margin-top: 10px;
}
.con-title__mid{
	font-size: 24px;
	margin-bottom: 30px;
}
@media only screen and (max-width: 1199px) {
	header{
		padding: 20px 40px;
	}
	header .logo{
		width: 190px;
	}
	.menu-wrap{
		right: 40px;
	}
	.menu-wrap__gmenu li{
		margin-right: 20px;
	}
	.menu-wrap__contact{
		padding-left: 20px;
	}
	.menu-wrap__contact span{
		font-size: 22px;
	}
}
@media only screen and (max-width: 991px) {
	header{
		padding: 20px 25px;
	}
	header .logo{
		width: 162px;
	}
	.menu-wrap{
		right: 25px;
		top: 20px;
	}
	.menu-wrap__gmenu li{
		margin-right: 15px;
	}
	.menu-wrap__contact{
		padding-left: 15px;
	}
	.menu-wrap__contact li:not(:last-child){
		margin-right: 10px;
	}
	.menu-wrap__contact img{
		width: 17px;
	}
	.menu-wrap__contact span{
		font-size: 20px;
	}
	.btn-link{
		width: 220px;
		padding: 20px 0;
	}
	.btn-link__text{
		font-size: 13px;
	}
	.con-title{
		margin-bottom: 25px;
	}
	.con-title dt{
		font-size: 11px;
	}
	.con-title dd{
		font-size: 22px;
	}
	.con-title__mid{
		font-size: 22px;
		margin-bottom: 20px;
	}
}
@media only screen and (max-width: 767px) {
	header{
		padding: 15px 20px;
	}
	header .logo{
		width: 146px;
	}
	.menu-wrap{
		display: none;
	}
	.openbtn {
		z-index: 6000;
    top: 14px;
    right: 20px;
    position: fixed;
    cursor: pointer;
    width: 50px;
    height: 30px;
    display: block;
  }
  .openbtn span {
  	display: inline-block;
  	transition: all .4s;
  	position: absolute;
  	height: 1px;
  	background-color: #000;
  	width: 100%;
  	display: block;
  }
  .openbtn span:nth-of-type(1) {
  	top: 10px;
  }
  .openbtn span:nth-of-type(2) {
  	top: 20px;
  }
  body.active .openbtn span:nth-of-type(1) {
    transform: translateY(5px) rotate(-15deg);
    width: 100%;
  }
  body.active .openbtn span:nth-of-type(2) {
  	transform: translateY(-5px) rotate(15deg);
  	width: 100%;
  }
	.pagenav-wrap {
  	background-color: #e9e9e4;
  	position: fixed;
  	left: 0;
  	top: 0;
  	width: 100vw;
  	height: 100vh;
  	z-index: 5000;
  	padding: 60px 0 0;
  }
	body.active .pagenav-wrap {
    opacity: 1;
    visibility: visible;
    display: block;
  }
  .pagenav-wrap .logo{
  	width: 146px;
  	height: auto;
  	position: absolute;
  	left: 20px;
  	top: 15px;
  }
  .menu-sp{
  	margin-top: 40px;
  	padding: 0 30px;
  }
  .menu-sp__gmenu{
  	width: 40%;
  	border-right: 1px solid #d5d5ce;
  }
  .menu-sp__gmenu li:not(:last-child){
  	margin-bottom: 20px;
  }
  .menu-sp__gmenu a{
  	font-size: 15px;
  }
  .menu-sp__contact{
  	width: 60%;
  	padding-left: 35px;
  }
  .menu-sp__contact h3{
  	font-size: 13px;
  	display: inline-block;
  	padding-bottom: 5px;
  	position: relative;
  	margin-bottom: 25px;
  }
  .menu-sp__contact h3::after{
  	content: "";
  	display: block;
  	position: absolute;
  	bottom: 0;
  	left: 0;
  	width: 100%;
  	height: 1px;
  	background-color: #000;
  }
  .tel-mail a{
  	justify-content: flex-start;
  	margin-bottom: 15px;
  	align-items: center;
  }
  .tel-mail img{
  	width: 20px;
  	height: auto;
  	margin-right: 5px;
  	vertical-align: top;
  }
  .tel-mail .tel-num{
  	font-size: 23px;
  	line-height: 1;
  	font-family: var(--font-serif);
  }
  .menu-sp__contact .foot-sns{
  	justify-content: flex-start;
  	margin-top: 40px;
  }
  .menu-sp__contact .foot-sns li{
  	margin-bottom: 5px;
  }
  .company-name{
  	text-align: center;
  	margin-top: 50px;
  	width: 100%;
  }
  .company-name img{
  	width: 190px;
  	height: auto;
  }
	.company-name p{
		margin-top: 15px;
		font-size: 12px;
	}
	.btn-link{
		width: 170px;
		padding: 15px 0;
	}
	.btn-link__text{
		font-size: 12px;
	}
	.con-title{
		margin-bottom: 20px;
	}
	.con-title dd{
		font-size: 21px;
	}
}
@media only screen and (max-width: 429px) {
	.btn-link{
		width: 150px;
		padding: 15px 0;
	}
	.con-title dd{
		font-size: 20px;
	}
}


article{
	padding-top: 84px;
}
.horizontal-menu{
	max-width: 1024px;
	width: 100%;
	margin: 0 auto;
}
.horizontal-menu li {
  width: 33.333333%;
}
.horizontal-menu a {
  display: block;
  position: relative;
  overflow: hidden;
}
.horizontal-menu img {
  display: block;
  transition: transform 0.8s ease;
}
.horizontal-menu a:hover img {
  transform: scale(1.05);
}
.horizontal-menu__name {
  position: absolute;
  top: 50%;
  left: 50%;
  transform: translate(-50%, -50%);
  color: #fff;
  font-size: 18px;
  z-index: 2;
  text-align: center;
  pointer-events: none;
}
.horizontal-menu__sub{
	width: 100%;
	border-top: 1px solid #cdcdc7;
}
.horizontal-menu__sub li{
	width: 33.33333%;
}
.horizontal-menu__sub li:nth-child(2){
	border-left: 1px solid #cdcdc7;
	border-right: 1px solid #cdcdc7;
}
.horizontal-menu__sub li a{
	display: block;
	padding: 100px 0;
	display: flex;
	align-items: center;
	transition: .3s;
}
.horizontal-menu__sub li a:hover{
	background-color: #000;
	color: #fff;
}
.horizontal-menu__sub .sub-menu__name{
	text-align: center;
	width: 100%;
	font-size: 17px;
}
@media only screen and (max-width: 1199px) {
	article{
		padding-top: 80px;
	}
}
@media only screen and (max-width: 991px) {
	article{
		padding-top: 74px;
	}
	.horizontal-menu__name {
	  font-size: 16px;
	}
}
@media only screen and (max-width: 767px) {
	article{
		padding-top: 60px;
	}
	.horizontal-menu__name {
	  writing-mode: vertical-rl;
	}
	.horizontal-menu img{
		object-fit: cover;
		width: 100%;
		height: 220px;
	}
	.horizontal-menu__sub li a{
		padding: 70px 0;
	}
}


/*footer*/
.foot-contact{
	background-color: #fff;
	text-align: center;
	padding-top: 50px;
	padding-bottom: 50px;
}
.foot-contact p{
	line-height: 28px;
}
.foot-contact h2{
	position: relative;
	display: inline-block;
	margin: 25px auto 10px;
}
.foot-contact h2::after{
	content: "";
	display: block;
	width: 100%;
	height: 1px;
	background-color: #000;
	position: absolute;
	bottom: 0;
	left: 0;
}
.foot-contact__col{
	justify-content: center;
	align-items: center;
	gap: 30px;
}
.foot-contact__col a{
	align-items: center;
}
.foot-contact__col img{
	width: 20px;
	margin-right: 5px;
}
.foot-contact__col .tel-num{
	font-size: 24px;
	font-family: var(--font-serif);
	letter-spacing: 0.06rem;
}
.foot-contact__col .mail-address{
	font-family: var(--font-en);
	letter-spacing: 0.04rem;
}
.foot-outline{
	background-color: #e9e9e4;
	padding-top: 80px;
	padding-bottom: 80px;
	position: relative;
}
.foot-outline p{
	font-size: 12px;
	line-height: 21px;
	margin-top: 10px;
}
.foot-menu li{
	line-height: 1;
}
.foot-menu li:not(:last-child){
	margin-right: 25px;
}
.foot-menu a{
	font-size: 13px;
	line-height: 1;
	transition: .3s;
}
.foot-menu a:hover{
	opacity: .6;
}
.foot-sns{
	justify-content: flex-end;
	margin-top: 20px;
}
.foot-sns li:not(:last-child){
	margin-right: 25px;
}
.foot-sns li a{
	align-items: center;
	transition: .3s;
}
.foot-sns li a:hover{
	opacity: .6;
}
.foot-sns img{
	width: 20px;
	height: auto;
	margin-right: 5px;
	vertical-align: top;
}
.foot-sns span{
	font-size: 13px;
	line-height: 1;
}
.foot-outline p.copyright{
	font-size: 11px;
	font-family: var(--font-en);
	text-align: right;
	letter-spacing: 0.04rem;
	margin-top: 5px;
}
@media only screen and (max-width: 991px) {
	.foot-contact p{
		font-size: 14px;
		line-height: 26px;
	}
	.foot-contact h2{
		margin: 20px auto 5px;
	}
	.foot-contact__col img{
		width: 18px;
	}
	.foot-contact__col .tel-num{
		font-size: 22px;
	}

	.foot-outline{
		padding-top: 70px;
		padding-bottom: 70px;
	}
	.foot-outline__left img{
		width: 224px;
		height: auto;
	}
	.foot-outline p{
		font-size: 11px;
		line-height: 20px;
		margin-top: 30px;
	}
	.foot-menu li:not(:last-child){
		margin-right: 20px;
	}
	.foot-sns li:not(:last-child){
		margin-right: 20px;
	}
	.foot-sns img{
		width: 18px;
	}
	.foot-outline p.copyright{
		margin-top: 20px;
	}
}
@media only screen and (max-width: 767px) {
	.foot-contact__col{
		gap: 5px;
	}
	.foot-contact__col img{
		width: 22px;
	}
	.foot-contact__col .tel-num{
		font-size: 24px;
	}
	.foot-outline{
		padding-top: 50px;
		padding-bottom: 50px;
	}
	.foot-outline__left{
		text-align: center;
		width: 100%;
	}
	.foot-outline__left img{
		width: 190px;
	}
	.foot-outline p{
		margin-top: 20px;
	}
	.foot-outline__right{
		width: 100%;
		margin-top: 30px;
	}
	.foot-menu{
		display: none;
	}
	.foot-sns{
		justify-content: center;
	}
	.foot-sns li:not(:last-child){
		margin-right: 20px;
	}
	.foot-outline p.copyright{
		margin-top: 20px;
		text-align: center;
	}
}


/*pagetitle*/
.pagetitle{
	height: 280px;
	position: relative;
	margin: 90px 60px 120px;
}
.pagetitle-inner{
  position: absolute;
  top: 0;
  left: 50%;
  transform: translate(-50%, -50%);
  background-color: #e9e9e4;
  padding: 45px 70px;
  width: auto;
  text-align: center;
  z-index: 10;
}
.pagetitle small{
	font-size: 12px;
	font-family: var(--font-en);
	color: #595959;
	letter-spacing: 0.04rem;
}
.pagetitle h2{
	font-size: 28px;
	line-height: 1;
}
.pagetitle-inner::after {
    content: "";
    width: 1px;
    height: 40px;
    background-color: #000;
    position: absolute;
    bottom: 0;
    left: 50%;
    transform: translate(-50%, 50%);
}
.pagetitle-text{
	margin: 70px 0 120px;
	padding-bottom: 120px;
	border-bottom: 1px solid #91918d;
}
.pagetitle-text small{
	font-size: 12px;
	font-family: var(--font-en);
	color: #595959;
	letter-spacing: 0.04rem;
}
.pagetitle-text h2{
	font-size: 28px;
	line-height: 1;
}
@media only screen and (min-width: 1500px) {
	.pagetitle{
		height: 18vw;
	}
}
@media only screen and (max-width: 1199px) {
	.pagetitle{
		height: 260px;
		margin: 70px 40px 100px;
	}
	.pagetitle-inner{
	  padding: 35px 60px;
	}
	.pagetitle-inner::after {
    height: 36px;
	}
	.pagetitle small{
		font-size: 11px;
	}
	.pagetitle h2{
		font-size: 26px;
	}
	.pagetitle-text{
		margin: 60px 0 100px;
		padding-bottom: 100px;
	}
	.pagetitle-text small{
		font-size: 11px;
	}
	.pagetitle-text h2{
		font-size: 26px;
	}
}
@media only screen and (max-width: 991px) {
	.pagetitle{
		height: 220px;
		margin: 50px 30px 70px;
	}
	.pagetitle-inner{
	  padding: 30px 50px;
	}
	.pagetitle-inner::after {
    height: 32px;
	}
	.pagetitle h2{
		font-size: 22px;
	}
	.pagetitle-text{
		margin: 40px 0 70px;
		padding-bottom: 70px;
	}
	.pagetitle-text h2{
		font-size: 22px;
	}
}
@media only screen and (max-width: 767px) {
	.pagetitle{
		height: 190px;
		margin: 20px 0 50px;
	}
	.pagetitle-inner{
	  padding: 26px 40px;
	}
	.pagetitle-inner::after {
    height: 28px;
	}
	.pagetitle small{
		font-size: 10px;
	}
	.pagetitle h2{
		font-size: 18px;
	}
	.pagetitle-text{
		margin: 15px 0 50px;
		padding-bottom: 40px;
	}
	.pagetitle-text small{
		font-size: 10px;
	}
	.pagetitle-text h2{
		font-size: 18px;
	}
}


/*home*/
.message{
	text-align: center;
	padding-top: 140px;
}
.message h1{
	font-size: 16px;
	letter-spacing: 0.05rem;
	font-family: var(--font-en);
	margin-bottom: 50px;
}
.message p{
	margin-bottom: 30px;
}
.info{
	margin-top: 150px;
	margin-bottom: 150px;
	position: relative;
}
.info-col{
	border-bottom: 1px solid #91918d;
	padding: 30px 0;
	justify-content: flex-start;
	align-items: center;
}
.info-col p{
	font-size: 13px;
	width: 8%;
	line-height: 1;
}
.info-col_cat{
	text-align: center;
	border-right: 1px solid #4f4f4d;
	border-left: 1px solid #4f4f4d;
}
.info-col a{
	font-size: 14px;
	width: 84%;
	padding-left: 30px;
}
.info .btn-link{
	position: absolute;
	top: 0;
	right: 0;
}
@media only screen and (max-width: 991px) {
	.message{
		padding-top: 100px;
	}
	.message h1{
		font-size: 15px;
		margin-bottom: 40px;
	}
	.info{
		margin-top: 100px;
		margin-bottom: 100px;
	}
	.info-col{
		padding: 25px 0;
	}
	.info-col p{
		font-size: 12px;
		width: 10%;
	}
	.info-col a{
		font-size: 13px;
		width: 80%;
		padding-left: 20px;
	}
}
@media only screen and (max-width: 767px) {
	.message{
		padding-top: 70px;
	}
	.message h1{
		margin-bottom: 30px;
	}
	.message p{
		margin-bottom: 20px;
	}
	.info{
		margin-top: 70px;
	}
	.info-col{
		flex-wrap: wrap;
		padding-top: 30px;
	}
	.info-col p{
		font-size: 12px;
		width: 24%;
	}
	.info-col_cat{
		border-right: none;
	}
	.info-col a{
		font-size: 13px;
		width: 100%;
		padding-left: 0;
		margin-top: 12px;
	}
}


/*about*/
.about .pagetitle{
	background: url(../images/about-bg.jpg) center no-repeat;
	background-size: cover;
}
.about-message p{
	text-align: center;
	line-height: 32px;
	margin-bottom: 30px;
}
.about-member{
	margin-top: 140px;
}
.member-wrap__col{
	width: 45%;
}
.member-wrap__person{
	border-right: 1px solid #91918d;
	padding-right: 30px;
}
.member-wrap__person dl{
	order: 2;
	width: 20%;
	writing-mode: vertical-rl;
}
.member-wrap__person dt{
	font-size: 13px;
	line-height: 1;
}
.member-wrap__person dd{
	font-size: 24px;
	line-height: 1;
	margin-right: 15px;
}
.member-wrap__person figure{
	order: 1;
	width: 80%;
}
.member-wrap__history{
	margin-top: 20px;
}
.member-wrap__history dl{
	border-bottom: 1px solid #91918d;
	padding: 20px 0;
}
.member-wrap__history dt{
	width: 17%;
	font-size: 14px;
}
.member-wrap__history dd{
	width: 83%;
	font-size: 14px;
}
.about-office{
	margin-top: 150px;
	margin-bottom: 150px;
}
.about-office dl{
	border-bottom: 1px solid #91918d;
	padding: 24px 0;
	align-items: center;
}
.about-office dt{
	width: 25%;
	text-align: center;
	font-size: 14px;
}
.about-office dd{
	width: 75%;
	font-size: 14px;
}
.about-office .gmap{
	width: 100%;
	height: 500px;
	margin-top: 100px;
}
.about-office .gmap iframe{
	width: 100%;
	height: 100%;
	filter: grayscale(100%);
}
@media only screen and (max-width: 991px) {
	.about-message p{
		margin-bottom: 25px;
	}
	.about-member{
		margin-top: 100px;
	}
	.member-wrap__col{
		width: 46%;
	}
	.member-wrap__person{
		padding-right: 20px;
	}
	.member-wrap__person dl{
		width: 22%;
	}
	.member-wrap__person dt{
		font-size: 12px;
	}
	.member-wrap__person dd{
		font-size: 22px;
		margin-right: 10px;
	}
	.member-wrap__person figure{
		width: 78%;
	}
	.member-wrap__history{
		margin-top: 10px;
	}
	.member-wrap__history dl{
		padding: 20px 0;
	}
	.member-wrap__history dt{
		font-size: 13px;
	}
	.member-wrap__history dd{
		font-size: 13px;
	}
	.about-office{
		margin-top: 100px;
		margin-bottom: 100px;
	}
	.about-office dt{
		width: 20%;
		font-size: 13px;
	}
	.about-office dd{
		width: 80%;
		font-size: 13px;
	}
	.about-office .gmap{
		margin-top: 70px;
	}
}
@media only screen and (max-width: 767px) {
	.about-message p{
		margin-bottom: 25px;
		text-align: left;
		line-height: 28px;
	}
	.about-message p br{
		display: none;
	}
	.about-member{
		margin-top: 70px;
	}
	.member-wrap__col{
		width: 100%;
		margin-bottom: 80px;
	}
	.member-wrap__person{
		padding-right: 20px;
	}
	.about-office{
		margin-top: 40px;
		margin-bottom: 70px;
	}
	.about-office h2{
		margin-bottom: 0;
	}
	.about-office dl{
		display: block;
	}
	.about-office dt{
		width: 100%;
		text-align: left;
		font-size: 13px;
		margin-bottom: 10px;
	}
	.about-office dd{
		width: 100%;
		font-size: 13px;
	}
	.about-office .gmap{
		margin-top: 50px;
		height: 400px;
	}
}


/*design policy*/
.design-policy .pagetitle{
	background: url(../images/policy-bg2.jpg) center no-repeat;
	background-size: cover;
}
.policy-col{
	align-items: center;
	margin-bottom: 80px;
}
.policy-col:last-child{
	margin-bottom: 150px;
}
.policy-col figure{
	width: 40%;
}
.policy-col .policy-col__text{
	width: 60%;
	padding-right: 70px;
	padding-left: 150px;
}
.policy-col.rev figure{
	order: 1;
}
.policy-col.rev .policy-col__text{
	order: 2;
	padding-left: 70px;
	padding-right: 150px;
}
.policy-col__text span{
	font-family: var(--font-en);
	font-size: 12px;
	border-bottom: 1px solid #a0a09c;
	padding-bottom: 10px;
	color: #595959;
}
.policy-col__text h3{
	font-size: 24px;
	margin: 35px 0 20px;
}
@media only screen and (max-width: 1199px) {
	/*.design-policy .pagetitle{
		background: url(../images/policy-bg.jpg) 22% center no-repeat;
	}*/
}
@media only screen and (max-width: 991px) {
	/*.design-policy .pagetitle{
		background: url(../images/policy-bg.jpg) 22% 12% no-repeat;
	}*/
	.policy-col:last-child{
		margin-bottom: 100px;
	}
	.policy-col .policy-col__text{
		padding-right: 60px;
		padding-left: 100px;
	}
	.policy-col.rev .policy-col__text{
		padding-left: 60px;
		padding-right: 100px;
	}
	.policy-col__text h3{
		font-size: 22px;
		margin: 30px 0 10px;
	}
}
@media only screen and (max-width: 767px) {
	.design-policy .pagetitle{
		background: url(../images/policy-bg-sp2.jpg) no-repeat;
	}
	.policy-col{
		padding: 0 20px;
	}
	.policy-col:last-child{
		margin-bottom: 70px;
	}
	.policy-col figure{
		width: 100%;
		margin-top: 20px;
	}
	.policy-col.rev figure{
		order: 2;
	}
	.policy-col .policy-col__text{
		width: 100%;
		padding-right: 0;
		padding-left: 0;
	}
	.policy-col.rev .policy-col__text{
		order: 1;
		padding-left: 0;
		padding-right: 0;
	}
	.policy-col__text h3{
		font-size: 20px;
		margin: 25px 0 10px;
	}
}



/*flow*/
.flow .pagetitle{
	background: url(../images/flow-bg.jpg) center no-repeat;
	background-size: cover;
}
.flow-step li{
	border-bottom: 1px solid #91918d;
	padding-bottom: 50px;
	margin-bottom: 50px;
	position: relative;
}
.flow-step li:first-child::after{
	display: none;
}
.flow-step li::after {
  content: "";
  position: absolute;
  left: 66px;
  top: -50px;
  width: 0;
  height: 0;
  border-style: solid;
  border-width: 12px 8px 0px 8px;
  border-color: #000 transparent transparent transparent;
  transform: translate(-50%, -50%);
}
.flow-step li:last-child{
	border-bottom: none;
	padding-bottom: 0;
	margin-bottom: 150px;
}
.flow-step__num{
	width: 13%;
	text-align: center;
	line-height: 1;
}
.flow-step__num span{
	font-size: 12px;
	line-height: 1;
	font-family: var(--font-en);
}
.flow-step__num .no{
	font-size: 40px;
	line-height: 1;
	font-family: var(--font-serif);
}
.flow-step__text{
	width: 87%;
	border-left: 1px solid #91918d;
	padding-left: 50px;
}
.flow-step__text dl{
	width: 50%;
	padding-right: 30px;
}
.wide .flow-step__text dl{
	width: 100%;
}
.flow-step__text dt{
	font-size: 20px;
	margin-bottom: 25px;
	line-height: 1;
}
.flow-step__text dd{
	line-height: 28px;
}
.flow-step__text figure{
	width: 50%;
}
.wide .flow-step__text figure{
	width: 100%;
	margin-top: 30px;
}
.flow-step__text img{
	vertical-align: top;
}
@media only screen and (max-width: 1199px) {
	.flow-step li::after {
	  left: 47px;
	}
	.flow-step__num{
		width: 10%;
	}
	.flow-step__text{
		width: 90%;
		padding-left: 45px;
	}
	.flow-step__num span{
		font-size: 11px;
	}
	.flow-step__num .no{
		font-size: 36px;
	}
}
@media only screen and (max-width: 991px) {
	.flow-step li::after {
	  left: 27px;
	}
	.flow-step__num{
		width: 8%;
	}
	.flow-step__text{
		width: 92%;
		padding-left: 35px;
	}
	.flow-step__num .no{
		font-size: 30px;
	}
	.flow-step__text dl{
		width: 55%;
		padding-right: 20px;
	}
	.flow-step__text dt{
		font-size: 18px;
		margin-bottom: 20px;
	}
	.flow-step__text figure{
		width: 45%;
	}
	.wide .flow-step__text figure{
		margin-top: 20px;
	}
}
@media only screen and (max-width: 767px) {
	.flow-step li{
		position: relative;
	}
	.flow-step li::after {
	  left: 50%;
	}
	.flow-step__num{
		width: 100%;
		position: absolute;
		left: 0;
		top: 0;
		border-right: 1px solid #91918d;
		width: 70px;
		margin-left: -10px;
	}
	.flow-step__num span{
		font-size: 12px;
	}
	.flow-step__num .no{
		font-size: 36px;
	}
	.flow-step__text{
		width: 100%;
		border-left: none;
		padding-left: 0;
	}
	.flow-step__text dl{
		width: 100%;
		padding-right: 0;
	}
	.flow-step__text dt{
		padding-left: 80px;
		line-height: 46px;
	}
	.flow-step__text figure{
		width: 100%;
		margin-top: 20px;
	}
}



/*column*/
.category-column{
	padding-bottom: 150px;
}
.column-box li{
	border-bottom: 1px solid #a0a09c;
	padding-bottom: 30px;
	margin-bottom: 30px;
}
.column-box a{
	align-items: center;
	position: relative;
	transition: .3s;
}
.column-box figure{
	width: 25%;
}
.column-box figure img{
	vertical-align: top;
}
.column-box__text{
	width: 65%;
	padding-left: 40px;
}
.column-link{
	width: 10%;
}
.column-box__text dt{
	font-size: 13px;
	font-family: var(--font-en);
}
.column-box__text dd{
	line-height: 26px;
}
.column-link{
	position: relative;
	width: 10%;
}
.column-link::before {
  content: "";
  position: absolute;
  top: 50%;
  right: 0%;
  width: 40px;
  height: 40px;
  border: 1px solid #91918d;
  border-radius: 50%;
  transform: translate(0%, -50%);
}
.column-link::after {
  content: "";
  position: absolute;
  top: 50%;
  right: 11%;
  width: 0;
  height: 0;
  border-style: solid;
  border-width: 4px 0 4px 8px;
  border-color: transparent transparent transparent #000;
  transform: translate(-40%, -50%);
}
.column-box a:hover{
	opacity: .6;	
}

.column-title{
	margin-bottom: 40px;
}
.column-title small{
	font-size: 13px;
	font-family: var(--font-en);
}
.column-title h2{
	font-size: 20px;
	line-height: 34px;
	margin-top: 5px;
}
.column-con{
	margin-top: 50px;
	padding-bottom: 50px;
}
.column-con p{
	line-height: 34px;
	margin-bottom: 50px;
}
.column-con figure{
	margin-bottom: 50px;
}
.column-con figure img{
	vertical-align: top;
}
.prev-next{
	align-items: center;
	margin-bottom: 150px;
}
.prev-next a{
	transition: .3s;
}
.prev-next a:hover{
	opacity: .6;
}
.prev-link a,
.next-link a{
	font-family: var(--font-en);
	font-size: 14px;
	position: relative;
}
.prev-link a::after{
	content: "";
  position: absolute;
  top: 50%;
  left: 0;
  width: 0;
  height: 0;
  border-style: solid;
  border-width: 4px 8px 4px 0;
  border-color: transparent #000 transparent transparent;
  transform: translate(0%, -50%);
}
.prev-link a{
	padding-left: 18px;
}
.next-link a{
	padding-right: 18px;
}
.next-link a::after{
	content: "";
  position: absolute;
  top: 50%;
  right: 0;
  width: 0;
  height: 0;
  border-style: solid;
  border-width: 4px 0 4px 8px;
  border-color: transparent transparent transparent #000;
  transform: translate(0%, -50%);
}
.list-link{
	width: 50px;
}
.list-link img{
	vertical-align: top;
}
@media only screen and (max-width: 1199px) {
	.column-link::after {
	  right: 12%;
	}
}
@media only screen and (max-width: 991px) {
	.category-column{
		padding-bottom: 100px;
	}
	.column-link::after {
	  right: 20%;
	}
	.column-box__text{
		width: 67%;
		padding-left: 30px;
	}
	.column-link{
		width: 8%;
	}
	.column-title h2{
		font-size: 18px;
		line-height: 30px;
	}
	.column-con p{
		line-height: 32px;
	}
}
@media only screen and (max-width: 767px) {
	.category-column{
		padding-bottom: 70px;
	}
	.column-box a{
		align-items: flex-start;
	}
	.column-box figure{
		width: 35%;
	}
	.column-box__text{
		width: 65%;
		padding-left: 20px;
	}
	.column-link{
		display: none;
	}
	.column-box__text dt{
		font-size: 12px;
		line-height: 1;
		margin-bottom: 10px;
	}
	.column-box__text dd{
		line-height: 24px;
	}
	.column-title{
		margin-bottom: 30px;
	}
	.column-title small{
		font-size: 12px;
	}
	.column-title h2{
		font-size: 17px;
		line-height: 28px;
	}
	.column-con{
		margin-top: 40px;
		padding-bottom: 40px;
	}
	.column-con p{
		margin-bottom: 40px;
	}
	.column-con figure{
		margin-bottom: 40px;
	}
	.prev-next{
		margin-bottom: 70px;
	}
}




/*build*/
.works-fv{
	max-width: 1200px;
	/*height: 800px;*/
	margin: 0 auto;
	width: 100%;
	position: relative;

}
/*.works-fv{
	height: calc(100vh - 84px);
	width: 100vw;
	background-color: #fff;
	position: relative;
}*/
.works-fv::before{
	width: 100%;
	height: 100%;
	background-color: rgba(0, 0, 0, 0.15);
	content: "";
	display: block;
	position: absolute;
	left: 0;
	top: 0;
	z-index: 50;
}
.works-fv img{
	vertical-align: top;
}
.fv-text{
	position: absolute;
	left: 50px;
	bottom: 40px;
	z-index: 100;
}
.fv-text h2{
	font-size: 26px;
	line-height: 44px;
	font-family: var(--font-serif);
	display: inline-block;
	position: relative;
	padding-bottom: 10px;
	margin-bottom: 15px;
	color: #fff;
	letter-spacing: 0.07rem;
}
.fv-text h2::after{
	content: "";
	display: block;
	width: 100%;
	height: 1px;
	background-color: #fff;
	position: absolute;
	left: 0;
	bottom: 0;
}
.fv-text p{
	color: #fff;
	font-size: 14px;
}
.common-wrap{
	position: relative;
	margin-top: 130px;
}
.common-wrap li{
	width: 30%;
}
.common-wrap li img{
	vertical-align: top;
}
.common-wrap p{
	font-size: 14px;
	line-height: 24px;
	margin-top: 15px;
}
.common-wrap>.btn-link{
	position: absolute;
	right: 0;
	top: -10px;
}
.movie-wrap__youtube {
  position: relative;
  width: 100%;
  padding-top: 56.25%;
}
.movie-wrap__youtube  iframe {
  position: absolute;
  top: 0;
  right: 0;
  width: 100% !important;
  height: 100% !important;
}
.movie-wrap li a{
	position: relative;
	width: 100%;
	padding: 10px 0;
	margin-top: 20px;
}
.other-wrap{
	margin-bottom: 150px;
}
.swiper-wrapper {
  align-items: stretch;
}

@media only screen and (min-width: 768px) {
	.swiper-wrapper{
		display: flex;
		justify-content: space-between;
	}
	.swiper-button-prev,
	.swiper-button-next{
		display: none!important;
	}
}
@media only screen and (max-width: 1199px) {
	/*.works-fv,
	.works-fv::before,
	.works-fv img{
		height: calc(100vh - 80px);
	}*/
	.fv-text{
		left: 40px;
		bottom: 40px;
	}
	.common-wrap{
		margin-top: 100px;
	}
	.common-wrap li{
		width: 31%;
	}
	.common-wrap p{
		line-height: 22px;
	}
	.other-wrap{
		margin-bottom: 100px;
	}
}
@media only screen and (max-width: 991px) {
	/*.works-fv,
	.works-fv::before,
	.works-fv img{
		height: calc(100vh - 74px);
	}*/
	.fv-text{
		left: 40px;
		bottom: 35px;
	}
	.fv-text h2{
		font-size: 24px;
		line-height: 40px;
	}
	.common-wrap p{
		line-height: 22px;
	}
}
@media only screen and (max-width: 767px) {
	/*.works-fv{
		height: calc(100vh - 60px);
	}
	.works-fv::before,
	.works-fv img{
		height: calc(100vh - 360px);
	}
	.works-fv img{
		vertical-align: top;
	}*/
	.works-fv::before{
		display: none;
	}
	.fv-text{
		position: relative;
		left: auto;
		bottom: auto;
		padding: 50px 0 60px;
		/*height: 300px;*/
		width: 100%;
		text-align: center;
		/*background-color: #c8c8c3;*/
	}
	/*.fv-text__inner{
		position: absolute;
		left: 50%;
		top: 50%;
		transform: translateY(-50%) translateX(-50%);
		width: 100%;
	}*/
	.fv-text h2{
		font-size: 20px;
		line-height: 34px;
		color: #000;
		display: block;
		padding-bottom: 0;
	}
	.fv-text h2::after{
		display: none;
	}
	.fv-text p{
		color: #000;
	}
	.common-wrap>.btn-link{
		top: 0;
	}
	.works-wrap{
		margin-top: 10px;
	}
	.other-wrap .con-title dd{
		font-size: 19px;
	}
	.other-wrap>.btn-link{
		position: relative;
		right: auto;
		top: auto;
		width: 100%;
	}
	/*.works-swiper {
    overflow: hidden;
  }*/
  .works-swiper,
  .movie-swiper{
  	position: relative;
  }
  .swiper-button-prev,
  .swiper-button-next{
    width: 40px!important;
    height: 40px!important;
    margin-top: 0!important;
    background-color: #fff;
    border-radius: 40px;
  }
  .swiper-button-prev.movie-button,
  .swiper-button-next.movie-button{
  	margin-top: -30px!important;
  }
  .swiper-button-prev::after,
  .swiper-button-next::after{
    content: ""!important;
	  position: absolute;
	  top: 50%;
	  left: 50%;
	  width: 0;
	  height: 0;
	  border-style: solid;
	  border-width: 4px 0 4px 8px;
	  border-color: transparent transparent transparent #000;
	  transform: translate(-50%, -50%);
  }
  .swiper-button-prev::after{
  	border-width: 4px 8px 4px 0;
		border-color: transparent #000 transparent transparent;
  }
	.swiper-inner .swiper-button-prev{
    left: -20px;
  }

  .swiper-inner .swiper-button-next{
    right: -20px;
  }
}
@media only screen and (max-width: 429px) {
	.other-wrap .con-title dd{
		font-size: 18px;
		letter-spacing: -0.15rem;
	}
}