@charset "UTF-8";
/* MainVisual
======================================================================*/
.MainVisual {
  text-align: center;
  margin-bottom: 80px;
}
@media screen and (max-width: 768px) {
.MainVisual {
	margin-top: 60px;
  margin-bottom: 40px;
}
}

.MainPhoto {
  position: relative;
  width: 100%;
}

.MainVisual p.ttl {
	position: absolute;
	top: 0;
	left: 50%;
	transform: translateX(-50%);
	z-index: 3;
}

.MainPhoto p.cap {
  text-align: right;
  position: absolute;
  bottom: 5px;
  right: 10px;
}

@media screen and (max-width: 768px) {
.MainVisual p.ttl img{
	max-width: 80px;
}
}

@media screen and (max-width: 480px) {
.MainVisual p.ttl img{
	max-width: 60px;
}
}


/* introWrap
======================================================================*/
.introWrap {}

.introWrap h2{
	margin-bottom: 80px
}
@media screen and (max-width: 768px) {
.introWrap h2{
	margin-bottom: 40px
}
}
.introWrap h3{
	margin-bottom: 20px
}

.introWrap p.lead{
	letter-spacing: -0.05em;
}

/* location
======================================================================*/
.location {
	margin-bottom: 120px;
}
@media screen and (max-width: 768px) {
.location {
	margin-bottom: 60px;
}
}

.location.last-child {
	margin-bottom: 0px;
}

.dwnArrow {
	text-align: center;
	margin: 40px auto;
	padding-right: 30px;
}
@media screen and (max-width: 768px) {
.dwnArrow {
	text-align: center;
	margin: 20px auto;
	padding-right: 10px;
}
.dwnArrow img{
	max-width: 30px;
}
}

.location h2{
	margin-bottom: 40px
}
@media screen and (max-width: 768px) {
.location h2{
	margin-bottom: 20px
}
}

.location p.lead{
	margin-bottom: 40px
}
@media screen and (max-width: 768px) {
.location p.lead{
	margin-bottom: 20px
}
}

.location p.lead.sht{
	letter-spacing: -0.05em;
}

.posi-img-1,
.posi-img-3{
	position: relative;
	text-align: center;
	margin-top: 20px;
}
@media screen and (max-width: 768px) {
.posi-img-3{
	margin-top: 0px;
}
}

.mid-col{
	position: relative;
	margin-top: 80px;
}
@media screen and (max-width: 768px) {
.mid-col{
	margin-top: 40px;
}
}

.mid-col h4{
	margin-bottom: 20px;
}

.mid-col p.lead{
	max-width: 440px;
}
@media screen and (max-width: 768px) {
.mid-col p.lead{
	max-width: 100%;
}
}

.posi-img-2{
	position: absolute;
	right: 20px;
	top: -80px;
	z-index: 3;
}
@media screen and (max-width: 768px) {
.posi-img-2{
	position: relative;
	right: 0px;
	top: 0px;
	text-align: center;
}
.posi-img-2 img{
	max-width: 100%;
}
}

.img-obi{
	width: 100%;
	position: relative;
	margin-bottom: 80px;
}
@media screen and (max-width: 768px) {
.img-obi{
	margin-bottom: 40px;
}
}

.img-obi.position{
	margin-bottom: 0px;
}

.img-obi p.cap{
	position: absolute;
	right: 5px;
	bottom: 5px;
	z-index: 3;
}

.btm-box{
	margin-top: 60px;
	margin-bottom: 120px;
	padding: 30px;
	border: 10px solid #ECEAE9;
	-webkit-box-sizing: border-box;
	-moz-box-sizing: border-box;
	box-sizing: border-box;
}
@media screen and (max-width: 768px) {
.btm-box{
	margin-top: 0px;
	margin-bottom: 60px;
	padding: 20px;
	border: 6px solid #ECEAE9;
}
}

.btm-box h4{
	text-align: center!important;
}

/***** inside *****/

.location .inside {
	position: relative;
    max-width: 1060px;
    padding: 0 30px;
    margin: 0 auto;
    -webkit-box-sizing: border-box;
    -moz-box-sizing: border-box;
    box-sizing: border-box;
}
@media screen and (max-width: 768px) {
.location .inside {
    padding: 0 20px;
}
}

.location .inside .phboxL {
    position: relative;
    width: 100%;
    max-width: 472px;
    -webkit-box-sizing: border-box;
  -moz-box-sizing: border-box;
  box-sizing: border-box;
  /*padding: 0 25px;*/
}

.location ul {
    position: relative;
    display: flex;
    flex-wrap: wrap;
    justify-content: space-between;
    margin-top: 35px;
}
@media screen and (max-width: 768px) {
.location ul {
    margin-top: 20px;
}
}

.location ul li {
    width: 48%;
    max-width: 472px;
    -webkit-box-sizing: border-box;
    -moz-box-sizing: border-box;
    box-sizing: border-box;
}
@media screen and (max-width: 768px) {
.location ul li {
    width: 100%;
    max-width: 100%;
    margin: 0 auto 20px;
}
.location ul li:last-child{
    margin-bottom: 0;
}
}

.location ul li.sml {
    width: 41%;
    max-width: 410px;
}

.location ul li.sml h4.line{
	font-size: 2.6rem!important;
	padding-bottom: 10px;
	margin-bottom: 20px;
}
@media screen and (max-width: 768px) {
.location ul li.sml h4.line{
	font-size: 1.8rem!important;
}
}

.location ul li.mid {
    width: 44%;
    max-width: 440px;
}

.location ul li.lrg {
    width: 50%;
    max-width: 505px;
}
@media screen and (max-width: 768px) {
.location ul li.sml {
    width: 100%;
	margin: 0 auto 20px;
}

.location ul li.mid {
    width: 100%;
	margin: 0 auto 20px;
}

.location ul li.lrg {
    width: 100%;
	margin: 0 auto 20px;
}
}
	
.location .photo {
    position: relative;
}

.location ul li .btm {
    margin-top: auto;
	padding-top: 20px;
}

/*col3-wrap*/

.location ul.col3-wrap {
    margin-top: 20px;
}

.location ul.col3-wrap li {
    width: 32%;
    max-width: 306px;
}

.location ul.col3-wrap li div{
    position: relative;
}

/*.location .inside h4 {
    text-align: left;
    margin-bottom: 20px;
    padding-bottom: 20px;
    border-bottom: 1px solid #D4CECB;
}*/

.location .inside p.caption {
	font-size: 1.4rem;
	text-align: justify;
    margin-bottom: 30px;
}
@media screen and (max-width: 768px) {
    .location .inside p.caption {
		font-size: 1.2rem;
    margin-bottom: 20px;
}
}

.location .inside p.caption span {
  font-size: 1.2rem;
  display: block;
}

.location .phboxR {
    position: absolute;
    top: 0;
    right: 0;
    width: 48%;
    max-width: 620px;
}

.location p.cap {
    position: absolute;
    right: 5px;
    bottom: 5px;
    /*color: #FFFFFF;*/
	z-index: 3;
}

.location .mapbox{
    max-width: 1000px;
    margin: 0 auto;
    position: relative;
}

.location .mapbox p.cap{
    position: absolute;
    left: 5px;
    bottom: 40px;
    color: #000000;
}


@media screen and (max-width: 768px) {
.location .inside .phboxL {
    width: 100%;
    max-width: 100%;
}
.location .phboxR {
    position: relative;
    width: 100%;
    max-width: 100%;
    padding: 0 20px;
    -webkit-box-sizing: border-box;
    -moz-box-sizing: border-box;
    box-sizing: border-box;
    margin-bottom: 40px;
}

.location .mapbox.no1{
    overflow: hidden;
}
	
.location .mapbox.no1 img{
    max-width: 120%;
    margin-left: -10%;
}
    
.location .mapbox p.cap{
    left: 5px;
    bottom: 5px;
}
    
}