@charset "UTF-8";

/*
Theme Name: TOKYO MINAMI SHM
Description: TOKYO MINAMI SHM
Version: 2022.03
Author: YH
*/


/*** clearfix ***/
.clearfix:after {
 content: ".";
 display: block;
 clear: both;
 height: 0;
 visibility: hidden;
}


/* ===========================================================================================

	Common

=========================================================================================== */

#mainArea {
	font-family: "游ゴシック", "YuGothic", "Yu Gothic", "Hiragino Kaku Gothic ProN", "Hiragino Kaku Gothic Pro", "ＭＳ ゴシック", sans-serif;
	overflow: hidden;
	color: #000;
	-webkit-text-size-adjust: none;
	height: auto !important;
}
.f_min {
	font-family: "游明朝", "Yu Mincho", "YuMincho", "Hiragino Mincho ProN", "HGS明朝E", serif;
}
.f_en {
	font-family: 'Roboto', sans-serif;
}
#mainArea p {
	color: inherit;
	font-size: 16px;
	line-height: 1.8em;
}
#mainArea a,
#mainArea a img {
	text-decoration: none;
	color: #000;
	transition: color 0.3s ease, background 0.3s ease, opacity 0.3s ease;
	outline: none;
}
#mainArea a:hover {
	opacity: 0.75;
}

#mainArea img { display: block; max-width: 100%; height: auto; }
#mainArea .non_pc { display: none !important; }

/** Common **********************/
#mainArea .site_header {
	position: relative;
	background: #fff;
	z-index: 10;
}
#mainArea .site_header > .inner {
	display: flex;
	align-items: center;
	padding: 0 40px 0 40px;
	box-sizing: border-box;
	height: 62px;
}
#mainArea .site_header h1 {
	width: 342px;
	margin: 0;
}
#mainArea .site_header h1 a {
	display: block;
}
#mainArea .site_header .bt_tel {
	display: block;
	font-size: 26px;
	font-weight: 500;
	color: #740000;
	margin-left: auto;
	letter-spacing: 0.05em;
	pointer-events: none;
	padding-top: 1px;
}
#mainArea .site_header .btbox {
	display: flex;
	margin-left: 35px;
}
#mainArea .site_header .btbox a {
	display: block;
	background: #740000;
	width: 100px;
	color: #fff;
	text-align: center;
	line-height: 30px;
	font-size: 13px;
	font-weight: bold;
}
#mainArea .site_header .btbox a + a {
	margin-left: 10px
}


/** Index **********************/
#mainArea.index .visual {
	height: 477px;
	display: flex;
	flex-direction: column;
	justify-content: center;
	align-items: center;
  position: relative;
}

#mainArea.index .visual .mainVisual {
  position: absolute;
  bottom: 0;
  left: 0;
  width: 100%;
  height: 100%;
  z-index: 0;
}
#mainArea.index .visual .mainVisual li {
  width: 100%;
  height: 100%;
}
#mainArea.index .visual .mainVisual img {
  height: 477px;
  width: 100%;
  object-fit: cover;
  max-width: none;
}
/* #mainArea.index .visual .lead {
	font-size: 21px;
	color: #740000;
	opacity: 0;
	transition: opacity 2s +2s ease;
  position: relative;
  z-index: 1;
} */
#mainArea.index .visual .titleBox {
	color: #740000;
	border: 1px solid #707070;
	padding: 25px 42px 20px;
	opacity: 0;
	transition: opacity 2s +2s ease;
  position: relative;
  z-index: 1;
  background: rgba(255, 255, 255, 0.8);
  text-align: center;
}
#mainArea.index .visual .titleBox p {
  font-size: 38px;
  line-height: 1.6;
}
#mainArea.index .visual .titleBox .lead {
  font-size: 22px;
  padding-bottom: 8px;
}
#mainArea.index .visual.active .titleBox {
	opacity: 1;
}
#mainArea.index .link_wrap {
	display: flex;
	flex-wrap: wrap;
}
#mainArea.index .link_wrap > div {
	width: 50%;
}
#mainArea.index .link_wrap > div a {
	display: block;
	background-size: 100% auto;
  background-position: center center;
  background-repeat: no-repeat;
	height: 400px;
	position: relative;
	transition: 0.6s all ease;
}
#mainArea.index .link_wrap > .company a {
	background-image: url(../images/bg_company.jpg);
}
#mainArea.index .link_wrap > .land a {
	background-image: url(../images/bg_land.jpg);
}
#mainArea.index .link_wrap > div a:hover {
	background-size: 110% auto;
	opacity: 1;
}
@media screen and (max-width: 1366px) {
	#mainArea.index .link_wrap > div a {
		background-size: auto 100%;
	}
	#mainArea.index .link_wrap > div a:hover {
		background-size: auto 110%;
	}
}
#mainArea.index .link_wrap > div a .info {
	position: absolute;
	overflow: hidden;
	width: 400px;
	height: 400px;
	padding-top: 10px;
	box-sizing: border-box;
	top: 0;
	left: 0;
}
#mainArea.index .link_wrap > .land a .info,
#mainArea.index .link_wrap > .architects a .info {
	right: 0;
	left: auto;
}
#mainArea.index .link_wrap > div a .info::before {
	content: "";
	position: absolute;
	display: block;
	background: #840000;
	width: 600px;
	height: 600px;
	transform: rotate(45deg);
	transform-origin: 100% 100%;
	opacity: 0.9;
	top: -182px;
	left: -620px;
	transition: 0.6s all ease;
}
#mainArea.index .link_wrap > .land a .info::before,
#mainArea.index .link_wrap > .architects a .info::before {
	right: -20px;
	left: auto
}
#mainArea.index .link_wrap > div a:hover .info::before {
	background: #111;
}
#mainArea.index .link_wrap > div a .info .lead {
	position: relative;
	color: #fff;
	margin: 25px 0 0 40px;
	font-size: 21px;
}
#mainArea.index .link_wrap > div a .info .text {
	position: relative;
	color: #fff;
	font-size: 18px;
	margin: 17px 0 0 40px;
	background: url(../images/icon_arrow.png) no-repeat 129px center;
	background-size: 10px 10px;
}
#mainArea.index .link_wrap > .land a .info .lead{
	margin: 25px 0 0 154px;
}
#mainArea.index .link_wrap > .architects a .info .lead {
	margin: 25px 0 0 132px;
}
#mainArea.index .link_wrap > .land a .info .text {
	margin: 17px 0 0 238px;
	background-position: 110px center;
}
#mainArea.index .link_wrap > .case a .info .text {
	background-position: 90px center;
}
#mainArea.index .link_wrap > .architects a .info .text {
	background-position: 112px center;
	margin: 17px 0 0 240px;
}

#mainArea.index .intro {
}
#mainArea.index .intro .bt_architects {
	position: relative;
	display: block;
	width: 638px;
	line-height: 1.5em;
	padding: 20px 0;
	text-align: center;
	border: 2px solid #661106;
	font-size: 20px;
	margin: 50px auto 30px auto;
	font-weight: bold;
	color: #661106;
}
#mainArea.index .intro .bt_architects:hover {
	opacity: 1;
	background: #661106;
	color: #fff;
}
#mainArea.index .intro .bt_architects::before {
	content: "";
	position: absolute;
	left: 50%;
	bottom: -30px;
	display: block;
	width: 16px;
	height: 16px;
	border-top: 2px solid #661106;
	border-right: 2px solid #661106;
	transform: translate(-50%, 0) rotate(135deg);
	transition: all ease 0.3s;
}
#mainArea.index .intro .bt_architects:hover::before {
	bottom: -35px;
}
#mainArea.index .intro .lead {
	text-align: center;
	font-size: 24px;
	padding: 30px 0;
}
#mainArea.index .intro > .inner {
	background: url(../images/bg_intro.jpg) no-repeat center bottom;
	background-size: cover;
	height: 682px;
}
#mainArea.index .intro .info {
	width: 1156px;
	margin: 0 auto;
	padding-top: 100px;
}
#mainArea.index .intro .info img {
	width: 372px;
}
#mainArea.index .intro .info .text {
	width: 372px;
	text-align: center;
	font-size: 15px;
	margin-top: 40px;
}
#mainArea.index .event {
	background: #F0F0F0;
	position: relative;
	overflow: hidden;
}
#mainArea.index .event::before {
	content: "";
	display: block;
	position: absolute;
	width: 1000px;
	height: 1000px;
	background: #f7f7f7;
	left: 50%;
	transform: translate(-50%, -50%) rotate(45deg);
}
#mainArea.index .event > .inner {
	width: 1038px;
	margin: 0 auto;
	padding: 70px 0 80px 0;
	position: relative;
}
#mainArea.index .event h2 {
	text-align: center;
	font-size: 19px;
	font-weight: bold;
	color: #740000;
	margin-bottom: 40px;
}
#mainArea.index .event .fbox {
	display: flex;
	justify-content: space-between;
	margin-top: 60px;
}
#mainArea.index .event .fbox .box {
	width: 300px;
	display: flex;
	align-items: start;
}
#mainArea.index .event .fbox .box img {width: 96px;}
#mainArea.index .event .fbox .box .info {
	margin-left: 20px;
}
#mainArea.index .event .fbox .box .info .title {
	font-size: 18px;
	font-weight: bold;
	border-bottom: 1px solid #DDDDDD;
	color: #740000;
	margin-bottom: 10px;
	padding-bottom: 7px;
}
#mainArea.index .event .fbox .box .info .text {
	font-size: 15px;
}
#mainArea .bnr_contact {
	margin-top: 35px;
}
#mainArea .bnr_contact .text {
	text-align: center;
	font-size: 15px;
}
#mainArea .bnr_contact a {
	display: block;
	height: 172px;
	background: url(../images/bnr_contact.jpg) no-repeat center bottom;
	background-size: cover;
	box-sizing: border-box;
	padding-top: 78px;
	margin-top: 12px;
	text-align: center;
	position: relative;
}
#mainArea .bnr_contact a::before {
	content: "";
	display: block;
	position: absolute;
	right: 0;
	width: 100%;
	top: 0;
	height: 100%;
	background: rgba(85, 0, 0, 0.75);
	transition: width 0.3s ease;
}
#mainArea .bnr_contact a:hover {
	opacity: 1;
}
#mainArea .bnr_contact a:hover::before {
	width: 0%;
}
#mainArea .bnr_contact a span {
	position: relative;
	display: inline-block;
	font-size: 19px;
	font-weight: bold;
	color: #fff;
	transition: transform 0.3s ease;
	background: url(../images/icon_arrow.png) no-repeat right center;
	background-size: 10px 10px;
	padding-right: 20px;
}
#mainArea .bnr_contact a:hover span {
	transform: scale(1.1);
}
#mainArea .case {
	position: relative;
}
#mainArea .case > .inner {width: 1038px;margin: 0 auto;padding: 50px 0 80px 0;}
#mainArea section.case .lead {text-align: center;font-size: 24px;}
#mainArea .case h2 {text-align: center;font-size: 19px;font-weight: bold;color: #740000;margin-top: 40px;border-bottom: 2px solid #F0F0F0;padding-bottom: 12px;}
#mainArea .case ul {display: flex;flex-wrap: wrap;justify-content: space-between;margin-top: 40px;}
#mainArea .case ul li {width: 487px;margin-top: 60px;}
#mainArea .case ul li:nth-child(-n+2) {
	margin-top: 0;
}
#mainArea .case ul li a {display: block;box-shadow: 1px 1px 3px rgba(0,0,0,0.16);padding-bottom: 35px;position: relative;overflow: hidden;}
#mainArea .case ul li a::before {
	content: "";
	position: absolute;
	display: block;
	width: 100px;
	height: 100px;
	background: #740000;
	transform: rotate(45deg);
	right: -60px;
	bottom: -60px;
	transition: 0.3s ease background;
}
#mainArea .case ul li a::after {
	content: "";
	display: block;
	position: absolute;
	width: 10px;
	height: 10px;
	background: url(../images/icon_arrow.png) no-repeat center center;
	background-size: contain;
	right: 10px;
	bottom: 10px;
}
#mainArea .case ul li a .img {
  overflow: hidden;
}
#mainArea .case ul li a .img img {
	transition: 0.3s ease transform;
}
#mainArea .case ul li a .title {font-size: 20px;text-align: center;margin-top: 30px;}
#mainArea .case ul li a .text {font-size: 15px;text-align: center;margin: 10px 0 0 0;}

#mainArea .case ul li a:hover::before {
	background: #1D1D1D;
}
#mainArea .case ul li a:hover .img img {
	transform: scale(1.1);
}
#mainArea .case ul li a:hover {
	opacity: 1;
	background: #F4F4F4;
}
#mainArea .access {
	background: #f0f0f0;
}
#mainArea .access > .text {
	text-align: center;
	padding: 65px 0 55px 0;
	font-size: 24px;
}
#mainArea .access .sec {

}
#mainArea .access .sec h2 {
	text-align: center;
	background: #740000;
	color: #fff;
	font-weight: bold;
	font-size: 19px;
	padding: 13px 0;
}
#mainArea .access .sec > .inner {
	padding: 20px 0 60px 0;
}
#mainArea .access .sec .bt_more {
	font-size: 13px;
	margin: 0 auto;
	width: 290px;
	display: flex;
	border: 1px solid #740000;
	color: #740000;
	padding: 14px 0;
	font-weight: bold;
	justify-content: center;
	align-items: center;
}
#mainArea .access .sec .bt_more::after {
	content: "";
	background: url(../images/icon_arrow_r.png) no-repeat right center;
	background-size: 10px 10px;
	display: block;
	width: 10px;
	height: 10px;
	margin-left: 10px;
}
#mainArea .access .sec .fbox {
	width: 1038px;
	margin: 40px auto 0 auto;
	display: flex;
	justify-content: space-between;
	align-items: start;
}
#mainArea .access .sec .fbox .info {
	width: 372px;
}
#mainArea .access .sec .fbox .info h3 {
	font-size: 18px;
	font-weight: bold;
	color: #740000;
}
#mainArea .access .sec .fbox .info section {
	margin-top: 15px;
}
#mainArea .access .sec .fbox .info section:nth-child(2) {
	margin-top: 20px;
	margin-bottom: 30px;
}
#mainArea .access .sec .fbox .info section h4 {
	font-size: 15px;
	border-bottom: 1px solid #DDDDDD;
	padding: 10px 0;
	margin-bottom: 10px;
}
#mainArea .access .sec .fbox .info section .bt_tel {
	display: block;
	font-size: 36px;
	letter-spacing: 0.05em;
	font-weight: 500;
	color: #740000;
	padding: 17px 20px 15px 60px;
	border-radius: 4px;
	background: url(../images/icon_tel.png) no-repeat 15px center;
	background-size: 30px 30px;
	background-color: #fff;
	box-shadow: 2px 4px 2px #ccc;
	margin-top: 15px;
	pointer-events: none;
}
#mainArea .access .sec .fbox .info section .bt_contact {
	display: block;
	font-size: 16px;
	letter-spacing: 0.05em;
	margin-top: 20px;
	font-weight: 500;
	color: #fff;
	padding: 16px 20px 16px 60px;
	background: url(../images/icon_mail.png) no-repeat 15px center, url(../images/icon_arrow.png) no-repeat calc(100% - 15px) center;
	background-size: 30px 30px, 10px 10px;
	font-weight: bold;
	background-color: #740000;
}
#mainArea .access .sec .fbox .info section .bt_contact:hover {
	background-color: #333;
	opacity: 1;
}
#mainArea .access .sec .fbox .info section .text {
	font-size: 15px;
	margin-top: 10px;
}
#mainArea .access .sec .fbox img {
	width: 564px;
	height: auto;
}
#mainArea .bnr_bottom {
	padding: 90px 0;
}
#mainArea .bnr_bottom a {
	display: block;
	width: 810px;
	margin: 0 auto;
}
#mainArea .bt_top {
	font-size: 13px;
	margin: 0 auto 30px auto;
	width: 280px;
	display: flex;
	color: #fff;
	background: #707070;
	padding: 14px 0 14px 5px;
	font-weight: bold;
	justify-content: center;
	align-items: center;
}
#mainArea .bt_top::after {
	content: "";
	background: url(../images/icon_arrow.png) no-repeat right center;
	background-size: 10px 10px;
	display: block;
	width: 10px;
	height: 10px;
	margin-left: 10px;
}
#mainArea .breadlist {
	border-top: 1px solid #D0D0D0;
}
#mainArea .breadlist > .inner {
	padding: 24px 0;
	width: 1156px;
	margin: 0 auto;
	font-size: 12px;
}
#mainArea .breadlist a,
#mainArea .breadlist span {
	display: inline-block;
	letter-spacing: 0.05em;
}
#mainArea .breadlist span {
	color: #707070;
}
/** Land **********************/
#mainArea.land .visual {

}
#mainArea.land .visual h2 {
}
#mainArea.land .visual h2 img {
	width: 100%;
}
#mainArea.land .visual .lead {
	font-size: 27px;
	width: 862px;
	text-align: center;
	background: #740000;
	line-height: 72px;
	color: #fff;
	margin: -36px auto -36px auto;
	position: relative;
	transition: 0.6s ease opacity;
}
#mainArea.land .visual .lead {
	opacity: 0;
}
#mainArea.land .problem {
	background: url(../land/images/bg_gray.jpg) no-repeat center center;
	background-size: cover;
}
#mainArea.land .problem > .inner {
	padding: 64px 0 45px 0;
	position: relative;
	height: 768px;
	box-sizing: border-box;
}
#mainArea.land .problem .lead,
#mainArea.land .way .lead {
	text-align: center;
	font-size: 17px;
	margin-bottom: 37px;
}
#mainArea.land .problem h3,
#mainArea.land .way h3 {
	font-size: 20px;
	font-weight: bold;
	text-align: center;
	width: 459px;
	height: 48px;
	background: url(../land/images/bg_h.png) no-repeat center center;
	background-size: cover;
	box-sizing: border-box;
	margin: 0 auto 0 auto;
	padding-top: 2px;
}
#mainArea.land .way .fbox + h3 {
	margin-top: 70px;
}
#mainArea.land .problem .fbox {
	display: flex;
	flex-wrap: wrap;
	justify-content: center;
	margin: 28px auto 0 auto;
	max-width: 1220px;
	position: absolute;
	top: 50%;
	transform: translate(-50%, -50%);
	width: 100%;
	left: 50%;
	margin-top: 100px;
}
#mainArea.land .problem .fbox a {
	width: calc(100% / 3);
	margin: -1% -0.5%;
	transition: all ease 0.3s;
	display: block;
}
#mainArea.land .problem .fbox a:hover {
	opacity: 1;
	transform: scale(1.07);
}
#mainArea.land .problem .detail {
	position: absolute;
	left: calc(50% + 960px);
	top: 0;
	height: 100%;
	width: 1920px;
}
#mainArea.land .problem .detail .box {
	position: absolute;
	left: 0;
	top: 0;
  width: 100%;
	overflow: hidden;
	transition: left 0.6s ease;
}
#mainArea.land .problem .detail .box.active {
  left: -100%;
}
#mainArea.land .problem .detail .box img {
	position: relative;
	left: 50%;
	transform: translate(-50%, 0);
}
#mainArea.land .problem .bt_back {
	position: absolute;
	background: #fff;
	font-size: 14px;
	font-weight: bold;
	left: 40px;
	top: 50%;
	z-index: 100;
	display: block;
	width: 80px;
	line-height: 40px;
	transform: none;
	border-radius: 6px;
	box-shadow: 0 3px 6px rgba(0, 0, 0, 0.13);
	box-sizing: border-box;
	padding-left: 34px;
	opacity: 0;
	pointer-events: none;
	transition: all 0.6s ease;
}
#mainArea.land .problem .bt_back.show {
	opacity: 1;
	pointer-events: auto;
}
#mainArea.land .problem .bt_back::before {
	content: "";
	width: 12px;
	height: 12px;
	border-top: 2px solid #000;
	border-right: 2px solid #000;
	display: block;
	transform: translate(0, -50%) rotate(-135deg);
	left: 11px;
	top: 50%;
	position: absolute;
}

#mainArea.land .way {

}
#mainArea.land .way > .inner {
	padding: 55px 0 75px 0;
}
#mainArea.land .way .lead {
	margin: 30px 0 0 0;
}
#mainArea.land .way .fbox {
	width: 890px;
	margin: 35px auto 0 auto;
	display: flex;
	flex-wrap: wrap;
	justify-content: space-between;
}
#mainArea.land .way .fbox .box {
	width: 420px;
}
#mainArea.land .way .fbox .box h4 {
	font-size: 24px;
	font-weight: bold;
	text-align: center;
	color: #fff;
	line-height: 54px;
	background: #740000;
}
#mainArea.land .way .fbox .box .text {
	font-size: 16px;
	margin-top: 23px;
	line-height: 1.8em;
}
#mainArea.land .way .fbox .box .text sup {
	font-size: 10px;
	position: relative;
	top: 5px;
}
#mainArea.land .way .fbox .box1 img {
	margin-top: 30px;
}
#mainArea.land .way .fbox .box1 .note {
	font-size: 12px;
	margin-top: 25px;
}
#mainArea.land .way .fbox .box2 img {
	margin-top: 20px;
}
#mainArea.land .way .fbox .box3 {
	width: 100%;
}
#mainArea.land .way .fbox .box3 .text {
  width: 370px;
  margin-right: 40px;
  float: left;
}
#mainArea.land .way .fbox .box3 img {width: 479px;margin: 30px 0 0 0;}


#mainArea.land .way .bnr_contact {
	width: 890px;
	margin: 60px auto 0 auto;
}
#mainArea.land .way .bnr_contact a {
	letter-spacing: 0.1em;
	height: 150px;
	padding-top: 43px;
}
#mainArea.land .way .bnr_contact a span  {
	display: block;
	margin: 0 30px;
	font-size: 20px;
}
#mainArea.land .way .bnr_contact a span strong {
	display: block;
	font-size: 34px;
	margin-bottom: 10px;
}
#mainArea.land .way .bnr_contact .note {
	font-size: 15px;
	font-weight: bold;
	text-align: center;
	width: 516px;
	line-height: 54px;
	border: 2px solid #000;
	border-radius: 8px;
	margin: 30px auto 0 auto;
}


/** Company **********************/
#mainArea.company .visual {
	height: 477px;
	background: url(../company/images/bg_visual.jpg) no-repeat center center;
	background-size: cover;
	position: relative;
	z-index: 10;
}
#mainArea.company .intro {
	background: #F0F0F0;
	position: relative;
	/* overflow: hidden; */
}
#mainArea.company .intro::before {
	content: "";
	display: block;
	position: absolute;
	width: 970px;
	height: 970px;
	background: #f7f7f7;
	left: 50%;
	transform: translate(-50%, -50%) rotate(45deg);
}
#mainArea.company .intro > .inner {
	width: 1156px;
	margin: 0 auto;
	padding: 120px 0 80px 0;
	position: relative;
}
#mainArea.company .intro h2 {
	line-height: 1.9em;
	font-size: 24px;
	margin-left: 60px;
}
#mainArea.company .intro h2 + .text {
	font-size: 17px;
	width: 453px;
	margin: 20px 0 0 60px;
}
#mainArea.company .intro .img {
	position: absolute;
	width: 528px;
	right: 50px;
	top: -50px;
	z-index: 100;
}
#mainArea.company .intro ul {
	display: flex;
	justify-content: center;
	flex-wrap: wrap;
	margin-top: 160px;
	padding-bottom: 40px;
}
#mainArea.company .intro ul li {
	width: 360px;
	margin-left: 30px;
	margin-top: 50px;
}
#mainArea.company .intro ul li:nth-child(1),
#mainArea.company .intro ul li:nth-child(4) {
	margin-left: 0;
}
#mainArea.company .intro ul li:nth-child(-n+3) {
	margin-top: 0;
}
#mainArea.company .intro ul li img {
	width: 138px;
	margin: 0 auto;
}
#mainArea.company .intro ul li .title {
	font-size: 19px;
	font-weight: bold;
	color: #740000;
	text-align: center;
	margin-top: 30px;
}
#mainArea.company .intro ul li .title span {
	font-size: 10px;
	position: relative;
	display: inline-block;
	top: -7px;
}
#mainArea.company .intro ul li .text {
	margin-top: 10px;
	font-size: 15px;
}
#mainArea.company .intro ul li .note {
	margin-top: 10px;
	font-size: 12px;
}
#mainArea.company .videobox {
	width: 600px;
	margin: 40px auto 80px auto;
}
#mainArea.company .videobox .title {
	text-align: center;
	font-size: 22px;
	margin-bottom: 10px;
	font-weight: bold;
}
#mainArea.company .videobox > .inner {
	width: 100%;
	position: relative;
	padding-bottom: 56.25%;
}

/**************************************************************/
/**************************************************************/
/** SP ********************************************************/
/**************************************************************/
/**************************************************************/
@media screen and (max-width: 767px) {
	.b-o-footer_content {
		padding-bottom: 1px;
	}
	#mainArea .non_pc { display: block !important; }
	#mainArea .non_sp { display: none !important; }

	/** Common **********************/
	#mainArea .site_header {
		position: relative;
		background: #fff;
		z-index: 10;
	}
	#mainArea .site_header > .inner {
		display: block;
		padding: 14px 15px 16px 15px;
		height: auto;
	}
	#mainArea .site_header h1 {
		width: 345px;
		margin: 0;
	}
	#mainArea .site_header .bt_tel {
		display: none;
	}
	#mainArea .site_header .btbox {
		display: flex;
		justify-content: center;
		margin: 20px 0 0 0;
	}
	#mainArea .site_header .btbox a {
		display: block;
		background: #740000;
		width: 100px;
		color: #fff;
		text-align: center;
		line-height: 30px;
		font-size: 13px;
		font-weight: bold;
	}
	#mainArea .site_header .btbox a + a {
		margin-left: 10px
	}


	/** Index **********************/
	#mainArea.index .visual {
		height: 477px;
		display: flex;
		flex-direction: column;
		justify-content: center;
		align-items: center;
	}
	#mainArea.index .visual .lead {
		font-size: 18px;
		color: #740000;
		text-align: center;
	}
	#mainArea.index .visual .titleBox {
		padding: 8px 0;
		margin: 0 auto 0 auto;
		text-align: center;
		width: 87%;
	}
  #mainArea.index .visual .titleBox p {
    font-size: 26px;
    line-height: 1.4;
  }
	#mainArea.index .visual .titleBox .lead {
		font-size: 16px;
    padding: 0 10px;
    line-height: 1.6;
	}
	#mainArea.index .link_wrap {
		display: block;
	}
	#mainArea.index .link_wrap > div {
		width: auto;
	}
	#mainArea.index .link_wrap > div a {
		background-size: cover;
		height: 400px;
		position: relative;
		transition: 0.6s all ease;
	}
	#mainArea.index .link_wrap .company a {
		background-image: url(../images/bg_company_sp.jpg);
		background-size: cover;
	}
	#mainArea.index .link_wrap > div a:hover {
		background-size: cover;
		opacity: 1;
	}
	#mainArea.index .link_wrap > div a .info {
		position: absolute;
		right: 0;
		top: 0;
		overflow: hidden;
		width: 400px;
		height: 400px;
		padding-top: 10px;
		box-sizing: border-box;
	}
	#mainArea.index .link_wrap .land a .info .lead {
		text-align: right;
		margin-right: 35px;
	}
	#mainArea.index .link_wrap > div a:hover .info::before {
		background: #840000;
	}
	#mainArea.index .link_wrap > .land a,
	#mainArea.index .link_wrap > .land a:hover {
		background-position: 80% top;
		background-size: auto 104%;
		background-color: #b2b2b2;
	}

	#mainArea.index .link_wrap > .architects a .info .lead {
		margin: 25px 0 0 140px;
	}
	#mainArea.index .link_wrap > .architects a .info .text {
		background-position: 110px center;
		margin: 17px 0 0 250px;
	}
	#mainArea.index .intro {
	}
	#mainArea.index .intro .bt_architects {
		position: relative;
		display: block;
		width: 90%;
		line-height: 1.5em;
		padding: 15px 0 15px 0.5em;
		text-align: center;
		border: 2px solid #661106;
		font-size: 16px;
		margin: 40px auto 30px auto;
		font-weight: bold;
		color: #661106;
	}
	#mainArea.index .intro .bt_architects:hover {
		opacity: 1;
		background: transparent;
		color: #661106;
	}
	#mainArea.index .intro .bt_architects:hover::before {
		bottom: -30px;
	}
	#mainArea.index .intro .lead {
		text-align: center;
		font-size: 16px;
		padding: 30px 0;
	}
	#mainArea.index .intro > .inner {
		background-position: center top;
		background-size: 100% auto;
		height: auto;
	}
	#mainArea.index .intro .info {
		width: auto;
		margin: 0 auto;
		padding-top: 144px;
		padding-bottom: 50px;
	}
	#mainArea.index .intro .info img {
		width: 286px;
		margin: 0 auto;
	}
	#mainArea.index .intro .info .text {
		width: auto;
		text-align: center;
		font-size: 15px;
		margin-top: 30px;
	}
	#mainArea.index .event {
		background: #F0F0F0;
		position: relative;
		overflow: hidden;
	}
	#mainArea.index .event::before {
		content: "";
		display: block;
		position: absolute;
		width: 270px;
		height: 270px;
		background: #f7f7f7;
		left: 50%;
		transform: translate(-50%, -50%) rotate(45deg);
	}
	#mainArea.index .event > .inner {
		width: 90%;
		margin: 0 auto;
		padding: 60px 0 50px 0;
		position: relative;
	}
	#mainArea.index .event h2 {
		text-align: center;
		font-size: 19px;
		font-weight: bold;
		color: #740000;
		margin-bottom: 40px;
	}
	#mainArea.index .event .fbox {
		display: block;
		justify-content: space-between;
		margin-top: 60px;
	}
	#mainArea.index .event .fbox .box {
		width: 300px;
		display: flex;
		align-items: start;
		margin: 35px auto 0 auto;
	}
	#mainArea.index .event .fbox .box img {width: 96px;}
	#mainArea.index .event .fbox .box .info {
		margin-left: 20px;
	}
	#mainArea.index .event .fbox .box .info .title {
		font-size: 18px;
		font-weight: bold;
		border-bottom: 1px solid #DDDDDD;
		color: #740000;
		margin-bottom: 10px;
		padding-bottom: 7px;
	}
	#mainArea.index .event .fbox .box .info .text {
		font-size: 15px;
	}
	#mainArea .bnr_contact {
		margin: 35px auto 0 auto;
		width: 300px;
	}
	#mainArea .bnr_contact .text {
		text-align: center;
		font-size: 15px;
	}
	#mainArea .bnr_contact a {
		display: block;
		height: 100px;
		padding-top: 21px;
		margin-top: 15px;
		text-align: center;
		position: relative;
	}
	#mainArea .bnr_contact a::before {
		content: "";
		display: block;
		position: absolute;
		right: 0;
		width: 100%;
		top: 0;
		height: 100%;
		background: rgba(85, 0, 0, 0.75);
		transition: width 0.3s ease;
	}
	#mainArea .bnr_contact a:hover {
		opacity: 1;
	}
	#mainArea .bnr_contact a:hover::before {
		width: 100%;
	}
	#mainArea .bnr_contact a span {
		position: relative;
		display: inline-block;
		font-size: 16px;
		font-weight: bold;
		line-height: 1.8em;
		color: #fff;
		transition: transform 0.3s ease;
		background: url(../images/icon_arrow.png) no-repeat 228px 38px;
		background-size: 10px 10px;
		padding-right: 0;
	}
	#mainArea .bnr_contact a:hover span {
		transform: scale(1);
	}
	#mainArea .case {
		position: relative;
	}
	#mainArea .case > .inner {width: 86%;margin: 0 auto;padding: 50px 0 40px 0;}
	#mainArea section.case .lead {text-align: center;font-size: 16px;}
	#mainArea .case h2 {text-align: center;font-size: 19px;font-weight: bold;color: #740000;margin-bottom: 40px;margin-top: 30px;}
	#mainArea .case ul {display: flex;flex-wrap: wrap;justify-content: space-between;margin-top: 40px;}
	#mainArea .case ul li {width: auto;margin-top: 40px;}
	#mainArea .case ul li:nth-child(-n+2) {
		margin-top: 40px;
	}
	#mainArea .case ul li:first-child {
		margin-top: 0;
	}
	#mainArea .case ul li a {display: block;box-shadow: 1px 1px 3px rgba(0,0,0,0.16);padding-bottom: 35px;position: relative;overflow: hidden;}
	#mainArea .case ul li a::before {
		content: "";
		position: absolute;
		display: block;
		width: 100px;
		height: 100px;
		background: #740000;
		transform: rotate(45deg);
		right: -60px;
		bottom: -60px;
		transition: 0.3s ease background;
	}
	#mainArea .case ul li a::after {
		content: "";
		display: block;
		position: absolute;
		width: 10px;
		height: 10px;
		background: url(../images/icon_arrow.png) no-repeat center center;
		background-size: contain;
		right: 10px;
		bottom: 10px;
	}
	#mainArea .case ul li a .img {
	  overflow: hidden;
	}
	#mainArea .case ul li a .img img {
		transition: 0.3s ease transform;
	}
	#mainArea .case ul li a .title {font-size: 16px;text-align: center;margin-top: 36px;line-height: 1.7em;}
	#mainArea .case ul li a .text {font-size: 13px;text-align: center;margin: 3px 0 0 0;}

	#mainArea .case ul li a:hover::before {
		background: #750000;
	}
	#mainArea .case ul li a:hover .img img {
		transform: scale(1);
	}
	#mainArea .case ul li a:hover {
		opacity: 1;
		background: #ffffff;
	}
	#mainArea .access {
		background: #f0f0f0;
	}
	#mainArea .access > .text {
		text-align: center;
		padding: 20px 0 20px 0;
		font-size: 16px;
		width: 300px;
		margin: 0 auto;
	}
	#mainArea .access .sec {

	}
	#mainArea .access .sec h2 {
		text-align: center;
		background: #740000;
		color: #fff;
		font-weight: bold;
		font-size: 17px;
		padding: 13px 0;
	}
	#mainArea .access .sec > .inner {
		padding: 20px 0 20px 0;
	}
	#mainArea .access .sec .bt_more {
		font-size: 13px;
		margin: 0 auto;
		width: 290px;
		display: flex;
		border: 1px solid #740000;
		color: #740000;
		padding: 14px 0;
		font-weight: bold;
		justify-content: center;
		align-items: center;
	}
	#mainArea .access .sec .bt_more::after {
		content: "";
		background: url(../images/icon_arrow_r.png) no-repeat right center;
		background-size: 10px 10px;
		display: block;
		width: 10px;
		height: 10px;
		margin-left: 10px;
	}
	#mainArea .access .sec .fbox {
		width: 90%;
		margin: 40px auto 0 auto;
		display: block;
		justify-content: space-between;
	}
	#mainArea .access .sec .fbox .info {
		width: 290px;
		margin: 0 auto;
	}
	#mainArea .access .sec .fbox .info h3 {
		font-size: 18px;
		font-weight: bold;
		color: #740000;
	}
	#mainArea .access .sec .fbox .info section {
		margin-top: 15px;
	}
	#mainArea .access .sec .fbox .info section:nth-child(2) {
		margin-top: 20px;
		margin-bottom: 20px;
	}
	#mainArea .access .sec .fbox .info section h4 {
		font-size: 15px;
		border-bottom: 1px solid #DDDDDD;
		padding: 10px 0;
		margin-bottom: 10px;
	}
	#mainArea .access .sec .fbox .info section .bt_tel {
		display: block;
		font-size: 30px;
		font-weight: 500;
		color: #740000;
		padding: 17px 20px 15px 60px;
		border-radius: 4px;
		background: url(../images/icon_tel.png) no-repeat 15px center;
		background-size: 30px 30px;
		background-color: #fff;
		box-shadow: 2px 4px 2px #ccc;
		margin-top: 15px;
		pointer-events: auto;
	}
	#mainArea .access .sec .fbox .info section .bt_contact {
		display: block;
		font-size: 16px;
		letter-spacing: 0.05em;
		margin-top: 20px;
		font-weight: 500;
		color: #fff;
		padding: 16px 20px 16px 60px;
		background: url(../images/icon_mail.png) no-repeat 15px center, url(../images/icon_arrow.png) no-repeat calc(100% - 15px) center;
		background-size: 30px 30px, 10px 10px;
		font-weight: bold;
		background-color: #740000;
	}
	#mainArea .access .sec .fbox .info section .bt_contact:hover {
		background-color: #740000;
		opacity: 1;
	}
	#mainArea .access .sec .fbox .info section .text {
		font-size: 15px;
		margin-top: 10px;
	}
	#mainArea .access .sec .fbox img {
		width: auto;
		margin-top: 30px;
	}

	/** Land **********************/
	#mainArea.land .visual {

	}
	#mainArea.land .visual h2 {
	}
	#mainArea.land .visual h2 img {
		width: 100%;
	}
	#mainArea.land .visual .lead {
		font-size: 18px;
		width: 310px;
		text-align: center;
		background: #740000;
		line-height: 1.8em;
		color: #fff;
		margin: -53px auto -40px auto;
		position: relative;
		padding: 14px 0;
	}
	#mainArea.land .problem {
		background: url(../land/images/bg_gray.jpg) no-repeat center center;
		background-size: cover;
	}
	#mainArea.land .problem > .inner {
		padding: 62px 0 42px 0;
		height: auto;
	}
	#mainArea.land .problem .lead,
	#mainArea.land .way .lead {
		text-align: center;
		font-size: 16px;
		margin: 0 20px 16px 20px;
	}
	#mainArea.land .problem h3,
	#mainArea.land .way h3 {
		font-size: 16px;
		font-weight: bold;
		text-align: center;
		width: 330px;
		height: 46px;
		background: url(../land/images/bg_h.png) no-repeat center center;
		background-size: 100% 100%;
		box-sizing: border-box;
		margin: 0 auto 0 auto;
		padding-top: 4px;
	}
	#mainArea.land .way .fbox + h3 {
		margin-top: 70px;
	}
	#mainArea.land .problem .fbox {
		display: block;
		justify-content: center;
		margin: 15px auto 0 auto;
		width: 97%;
		padding-left: 6px;
		position: relative;
		left: auto;
		top: auto;
		transform: none;
	}
	#mainArea.land .problem .fbox a {
		width: auto;
		margin: -12px 0 0 0;
		transition: all ease 0.3s;
	}
	#mainArea.land .problem .fbox a:hover {
		opacity: 1;
		transform: scale(1);
	}

	#mainArea.land .problem .detail {
		position: absolute;
		left: 100%;
		top: auto;
		bottom: 0;
		height: auto;
		padding-top: 203.6%;
		width: 100%;
	}
	#mainArea.land .problem .detail .box {
		position: absolute;
		left: 0;
		top: 0;
	  width: 100%;
		overflow: hidden;
		transition: left 0.6s ease;
	}
	#mainArea.land .problem .detail .box.active {
	  left: -100%;
	}
	#mainArea.land .problem .detail .box img {
		position: relative;
		left: 50%;
		transform: translate(-50%, 0);
	}
	#mainArea.land .problem .bt_back {
		position: absolute;
		background: #fff;
		font-size: 14px;
		font-weight: bold;
		left: 50%;
		bottom: 3.7%;
		top: auto;
		z-index: 100;
		display: block;
		width: 80px;
		line-height: 40px;
		transform: none;
		border-radius: 6px;
		box-shadow: 0 3px 6px rgba(0, 0, 0, 0.13);
		box-sizing: border-box;
		padding-left: 34px;
		opacity: 0;
		pointer-events: none;
		transition: all 0.6s ease;
		margin-left: -40px;
	}
	#mainArea.land .problem .bt_back.show {
		opacity: 1;
		pointer-events: auto;
	}
	#mainArea.land .problem .bt_back::before {
		content: "";
		width: 12px;
		height: 12px;
		border-top: 2px solid #000;
		border-right: 2px solid #000;
		display: block;
		transform: translate(0, -50%) rotate(-135deg);
		left: 11px;
		top: 50%;
		position: absolute;
	}

	#mainArea.land .way {

	}
	#mainArea.land .way > .inner {
		padding: 50px 0 65px 0;
	}
	#mainArea.land .way .lead {
		margin: 10px 20px 0 20px;
	}
	#mainArea.land .way .fbox {
		width: 88%;
		margin: 20px auto 0 auto;
		display: flex;
		flex-wrap: wrap;
		justify-content: space-between;
	}
	#mainArea.land .way .fbox .box {
		width: auto;
	}
	#mainArea.land .way .fbox .box h4 {
		font-size: 21px;
		font-weight: bold;
		text-align: center;
		color: #fff;
		line-height: 54px;
		background: #740000;
	}
	#mainArea.land .way .fbox .box .text {
		font-size: 16px;
		margin-top: 23px;
		line-height: 1.8em;
	}
	#mainArea.land .way .fbox .box1 img {
		margin: 30px auto 0 auto;
		width: 290px;
	}
	#mainArea.land .way .fbox .box2 {
		margin-top: 30px;
	}
	#mainArea.land .way .fbox .box2 img {
		margin-top: 20px;
	}
	#mainArea.land .way .fbox .box3 {
		margin-top: 0;
		width: auto;
	}
	#mainArea.land .way .fbox .box3 .text {
	  width: auto;
	  margin-right: 0;
	  float: none;
	}
	#mainArea.land .way .fbox .box3 img {width: 225px;margin: 20px auto 0 auto;}


	#mainArea.land .way .bnr_contact {
		width: 88%;
		margin: 50px auto 0 auto;
	}
	#mainArea.land .way .bnr_contact a {
		letter-spacing: 0;
		height: 102px;
		padding-top: 26px;
	}
	#mainArea.land .way .bnr_contact a span  {
		display: block;
		margin: 0;
		font-size: 14px;
		background-position: right 13px center;
	}
	#mainArea.land .way .bnr_contact a span strong {
		display: block;
		font-size: 25px;
		margin-bottom: 5px;
	}
	#mainArea.land .way .bnr_contact .note {
		font-size: 15px;
		font-weight: bold;
		text-align: center;
		width: 295px;
		line-height: 1.7em;
		border: 2px solid #000;
		border-radius: 8px;
		margin: 30px auto 0 auto;
		padding: 17px 0;
	}
	/** Company **********************/
	#mainArea.company .visual {
		height: 225px;
		z-index: 10;
	}
	#mainArea.company .intro {
		background: #F0F0F0;
		position: relative;
		/* overflow: hidden; */
	}
	#mainArea.company .intro::before {
		content: "";
		display: block;
		position: absolute;
		width: 270px;
		height: 270px;
		background: #f7f7f7;
		left: 50%;
		transform: translate(-50%, -50%) rotate(45deg);
	}
	#mainArea.company .intro > .inner {
		width: 90%;
		margin: 0 auto;
		padding: 30px 0 30px 0;
		position: relative;
	}
	#mainArea.company .intro h2 {
		line-height: 1.9em;
		font-size: 24px;
		margin: 0 10px 0 10px;
	}
	#mainArea.company .intro h2 br {
		display: none;
	}
	#mainArea.company .intro h2 + .text {
		font-size: 17px;
		width: auto;
		margin: 20px 10px 0 10px;
	}
	#mainArea.company .intro .img {
		position: relative;
		width: 104%;
		max-width: 104%;
		right: auto;
		top: auto;
		z-index: 100;
		left: -2%;
		margin-top: 30px;
	}
	#mainArea.company .intro ul {
		display: flex;
		justify-content: center;
		flex-wrap: wrap;
		margin-top: 50px;
		padding-bottom: 40px;
	}
	#mainArea.company .intro ul li {
		width: 48%;
		margin-left: 4%;
		margin-top: 40px;
	}
	#mainArea.company .intro ul li:nth-child(1),
	#mainArea.company .intro ul li:nth-child(4) {
		margin-left: 4%;
	}
	#mainArea.company .intro ul li:nth-child(-n+3) {
		margin-top: 40px;
	}
	#mainArea.company .intro ul li:nth-child(1),
	#mainArea.company .intro ul li:nth-child(3),
	#mainArea.company .intro ul li:nth-child(5) {
		margin-left: 0;
	}
	#mainArea.company .intro ul li:nth-child(5) {
		width: 100%;
	}
	#mainArea.company .intro ul li:nth-child(-n+2) {
		margin-top: 0;
	}
	#mainArea.company .intro ul li img {
		width: 100px;
		margin: 0 auto;
	}
	#mainArea.company .intro ul li .title {
		font-size: 19px;
		font-weight: bold;
		color: #740000;
		text-align: center;
		line-height: 1.5em;
		margin-top: 20px;
	}
	#mainArea.company .intro ul li:nth-child(3) .title {
		min-height: 3em;
	}
	#mainArea.company .intro ul li .title span {
		font-size: 10px;
		position: relative;
		display: inline-block;
		top: -7px;
	}
	#mainArea.company .intro ul li .text {
		margin-top: 15px;
		font-size: 15px;
		text-align: justify;
		padding: 0 5px;
	}
	#mainArea.company .intro ul li .note {
		margin-top: 10px;
		font-size: 12px;
	}
	#mainArea.company .intro ul li:nth-child(4) .note {
		width: 200%;
		position: relative;
		left: -100%;
	}
	#mainArea .bnr_bottom {
		padding: 30px 0;
	}
	#mainArea .bnr_bottom a {
		width: 86%;
	}
	#mainArea .bt_top {
	margin: 15px auto 30px auto;
	}
	#mainArea .bt_top::after {
		content: "";
		background: url(../images/icon_arrow.png) no-repeat right center;
		background-size: 10px 10px;
		display: block;
		width: 10px;
		height: 10px;
		margin-left: 10px;
	}
	#mainArea.company .videobox {
		width: auto;
		margin: 30px auto 60px auto;
	}
	#mainArea.company .videobox .title {
		text-align: center;
		font-size: 22px;
		margin-bottom: 10px;
		font-weight: bold;
	}
	#mainArea.company .videobox > .inner {
		width: 100%;
		position: relative;
		padding-bottom: 56.25%;
	}
}