@charset "UTF-8";
html {
  overflow-y: scroll;
}
body, div, dl, dt, dd, ul, ol, li, h1, h2, h3, h4, h5, h6, pre, code, form, fieldset, legend, input, textarea, p, blockquote, th, td {
  margin: 0;
  padding: 0;
}
table {
  border-collapse: collapse;
  border-spacing: 0;
}
fieldset, img {
  border: 0;
}
img {
  vertical-align: bottom;
}
address, caption, cite, code, dfn, em, strong, th, var {
  font-style: normal;
  font-weight: normal;
}
li {
  list-style: none;
}
caption, th {
  text-align: left;
}
h1, h2, h3, h4, h5, h6 {
  font-size: 100%;
  font-weight: normal;
}
q:before, q:after {
  content: '';
}
abbr, acronym {
  border: 0;
  font-variant: normal;
}
input, textarea, select {
  font-family: inherit;
  font-size: inherit;
  font-weight: inherit;
}
/*to enable resizing for IE*/
input, textarea, select {
  *font-size: 100%;
}
/*because legend doesn't inherit in IE */
legend {
  color: #000;
}
del, ins {
  text-decoration: none;
}
#News {
  padding-top: 50px;
}
h2.shopname {
  font-size: 1.5rem;
  text-align: center;
  margin: 1rem auto;
  letter-spacing: .25rem;
}
.cafe-logo {
  margin: 3rem auto 0 auto;
  text-align: center;
  width: 90%;
  max-width: 450px;
}
.cafe-logo img {
  width: 100%;
  height: auto;
}
.btn-ec {
  width: 90%;
  max-width: 300px;
  margin: 50px auto 0 auto;
}
.btn-ec a {
  display: block;
}
.btn-ec a img {
  width: 100%;
  height: auto;
}
.bar-logo {
  margin: 3rem auto 0 auto;
  text-align: center;
  width: 90%;
  max-width: 370px;
}
.bar-logo img {
  width: 100%;
  height: auto;
}
.social-area {
  width: 100%;
  padding: 10px 0;
  text-align: center;
}
.social-area li {
  width: 40px;
  display: inline-block;
  margin: 5px;
}
.social-area li a {
  display: block;
}
.social-area li img {
  width: 100%;
  height: auto;
  display: block;
}
#irimoyacafe {
  /*.head .headBody h1 img{
  	opacity: 0;
  	&.active{
  		height: 60px;
  		width: auto;
  		opacity: 1;
  		@media screen and (max-width: 768px){
  			height: 30px;
  			width: auto;
  		}
  	}
  	
  }*/
}
#irimoyacafe .slidemain .photo .inner.p01 {
  background: url("../images/slide01.jpg") center center;
}
#irimoyacafe .slidemain .photo .inner.p02 {
  background: url("../images/slide04.jpg") center center;
}
#irimoyacafe .slidemain .photo .inner.p03 {
  background: url("../images/slide03.jpg") center center;
}
#irimoyacafe .slidemain .photo .inner.p04 {
  background: url("../images/slide07.jpg") center center;
}
#irimoyacafe .slidemain .photo .inner.p05 {
  background: url("../images/slide06.jpg") center center;
}
#irimoyacafe .slidemain .photo .inner.p07 {
  background: url("../images/slide02.jpg") center center;
}
#irimoyacafe .slidemain .photo .inner.p08 {
  background: url("../images/slide05.jpg") center center;
}
#irimoyacafe .slidemain .photo .inner.p09 {
  background: url("../images/slide09.jpg") center center;
}
.bnr-spmenu {
  width: 90%;
  max-width: 312px;
  margin: auto;
}
.bnr-spmenu img {
  width: 100%;
  height: auto;
}
.contents {
  padding-top: 50px;
  padding-bottom: 50px;
}
@media screen and (max-width: 600px) {
  .contents {
    padding-top: 0;
  }
}
.contents .ttl-en {
  text-align: center;
  margin-bottom: 30px;
}
.contents .sec_visual {
  width: 100%;
  position: relative;
}
.contents .sec_visual img {
  width: 100%;
  height: auto;
  display: block;
}
.contents .sec_photo {
  width: 70%;
  height: 460px;
  background-size: cover;
  background-position: center center;
}
.contents .sec_text {
  position: absolute;
  top: 50%;
  transform: translateY(-50%);
  width: 40%;
  background-color: #f6f5ec;
  padding: 40px;
}
.contents .sec_text img {
  width: 100%;
  height: auto;
  display: block;
}
@media screen and (max-width: 768px) {
  .contents .sec_text {
    width: 90%;
    position: relative;
    transform: translateY(-20px);
    padding: 40px 0;
    margin-left: 5%;
    text-align: center;
  }
  .contents .sec_text img {
    display: inline-block;
    width: 80%;
  }
}
.contents .sec_btn a {
  width: 120px;
  display: block;
  padding: 0.25em 0;
  color: #221815;
  font-weight: bold;
  text-align: center;
  font-size: 15px;
  border: 2px solid #c3b191;
  border-radius: 2em;
  text-decoration: none;
  margin: 30px auto 0;
}
.contents .sec_copy_txt {
  position: absolute;
  bottom: -2em;
  left: 5%;
  font-size: 18px;
  background-color: black;
  padding: 20px 10px;
  color: #FFFFFF;
  /*-webkit-writing-mode:vertical-rl;
        -ms-writing-mode:tb-rl;
            writing-mode:vertical-rl;*/
}
.contents .sec_copy_txt img {
  width: 18px;
  height: auto;
}
@media screen and (max-width: 768px) {
  .contents .sec_copy_txt {
    bottom: auto;
    top: -1em;
    font-size: 16px;
  }
  .contents .sec_copy_txt img {
    width: 16px;
  }
}
@media screen and (max-width: 600px) {
  .contents .sec_copy_txt {
    top: -1em;
    left: 2%;
    font-size: 14px;
  }
  .contents .sec_copy_txt img {
    width: 14px;
  }
}
@media screen and (max-width: 480px) {
  .contents .sec_copy_txt {
    font-size: 12px;
    padding: 10px 7.5px;
  }
  .contents .sec_copy_txt img {
    width: 12px;
  }
}
@media screen and (max-width: 380px) {
  .contents .sec_copy_txt {
    font-size: 10px;
    padding: 10px 5px;
  }
  .contents .sec_copy_txt img {
    width: 10px;
  }
}
.contents .sec_box {
  position: relative;
  width: 100%;
}
.contents .sec_box.right-side .sec_text {
  right: 0;
}
.contents .sec_box.left-side .sec_text {
  left: 0;
}
.contents .sec_box.left-side .sec_photo {
  margin-left: 30%;
}
@media screen and (max-width: 768px) {
  .contents .sec_box .sec_photo {
    width: 100%;
    height: auto;
    padding-bottom: 50%;
  }
  .contents .sec_box.right-side .sec_text {
    right: 0;
  }
  .contents .sec_box.left-side .sec_text {
    left: 0;
  }
  .contents .sec_box.left-side .sec_photo {
    margin-left: 0%;
  }
}
/*-----------------------------------

	sec1

------------------------------------*/
#sec1 .sec_text {
  width: 290px;
}
#sec1 .sec_text img {
  max-width: 290px;
}
@media screen and (max-width: 768px) {
  #sec1 .sec_text {
    width: 90%;
  }
}
#sec1 .sec_photo {
  background-image: url("../images/photo-naturallocal.jpg");
}
/*-----------------------------------

	sec2

------------------------------------*/
#sec2 .sec_text {
  width: 360px;
}
#sec2 .sec_text img {
  max-width: 360px;
}
@media screen and (max-width: 768px) {
  #sec2 .sec_text {
    width: 90%;
  }
}
#sec2 .sec_photo {
  background-image: url("../images/photo-barista.jpg");
}
@media screen and (max-width: 768px) {
  #sec2 {
    padding-top: 40px;
  }
}
/*-----------------------------------

	sec3

------------------------------------*/
#sec3 .sec_text {
  width: 360px;
}
#sec3 .sec_text img {
  max-width: 360px;
}
@media screen and (max-width: 768px) {
  #sec3 .sec_text {
    width: 90%;
  }
}
#sec3 .sec_photo {
  background-image: url("../images/photo-soup.png");
}
/*-----------------------------------

	sec4

------------------------------------*/
#sec4 {
  width: 100%;
  max-width: none;
  background-color: #fbead6;
  /*.sec_pic_group1{
  		position: relative;
  		width:100%;
  		max-width:360px;
  		margin-left: 10%;
  		margin-top: 10px;
  		
  		.sec_pic_group_inner{
  			width:100%;
  			padding-bottom: 400/360*100%;
  			overflow: hidden;
  		}
  		.sec_pic{
  			position: absolute;
  			img{width:100%; height: auto; display: block;}
  		}
  		#sec4_pic2{
  			top:0; left: 0;
  			width:306/360 *100%;
  		}
  		#sec4_pic3{
  			top:208/400*100%; left: 0;
  			width:188/360 *100%;
  		}
  		#sec4_pic4{
  			bottom:0; right: 0;
  			width:172/360 *100%;
  		}
  
  		@media screen and (max-width: 768px){
  			width:90%;
  			max-width:none;
  			margin-left: 5%;
  			margin-top: 0px;
  			.sec_pic_group_inner{
  				padding-bottom: 44%;
  			}
  			#sec4_pic2{
  				top:0; left: 0;
  				width:64.7%;
  			}
  			#sec4_pic3{
  				display: none;
  			}
  			#sec4_pic4{
  				bottom:auto; top:0; right: 0;
  				width:35.3%;
  			}
  		}
  	}*/
}
@media screen and (max-width: 768px) {
  #sec4 {
    padding-top: 50px;
  }
}
#sec4 .sec_inner {
  background-color: #fbead6;
  padding-bottom: 30px;
}
#sec4 .sec_visual .sec_copy_txt {
  left: auto;
  right: 10%;
  z-index: 1;
}
#sec4 .logo-cafe {
  width: 90%;
  max-width: 470px;
  margin: 20px auto 0 auto;
  padding-bottom: 50px;
}
#sec4 .logo-cafe img {
  width: 100%;
  height: auto;
}
#sec4 .cf {
  width: 100%;
  max-width: 1000px;
  margin-left: auto;
  margin-right: auto;
  position: relative;
  padding-bottom: 10%;
}
@media screen and (max-width: 768px) {
  #sec4 .cf {
    padding-bottom: 50px;
  }
}
#sec4 .sec_left {
  /*position: relative;
    margin-left: 5%;
    width:360/1000 * 100%;
    float: left;*/
  position: relative;
  width: 40%;
  margin-top: -5%;
}
@media screen and (max-width: 768px) {
  #sec4 .sec_left {
    width: 100%;
    margin-left: 0%;
    float: none;
    margin-top: 0;
  }
}
#sec4 .sec_left .sec_text {
  position: static;
  transform: translateY(-30px);
  width: 100%;
  padding-right: 40%;
}
#sec4 .sec_left .sec_text img {
  max-width: 366px;
}
@media screen and (max-width: 768px) {
  #sec4 .sec_left .sec_text {
    width: 90%;
    max-width: none;
    padding-right: 0;
  }
}
#sec4 .sec_right {
  /*width:45%;
    float: right;
    margin-right: 5%;
    .sec_pic{
    	img{width:100%; height: auto; display: block;}
    }*/
  position: absolute;
  top: 5%;
  right: 0;
  width: 45.3%;
}
#sec4 .sec_right img {
  width: 100%;
  height: auto;
}
#sec4 .sec_right #l1-1 {
  width: 100%;
}
#sec4 .sec_right .flex {
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -ms-flex-wrap: wrap;
  flex-wrap: wrap;
  -webkit-box-pack: end;
  -ms-flex-pack: end;
  justify-content: flex-end;
  -webkit-box-align: stretch;
  -ms-flex-align: stretch;
  align-items: stretch;
  margin-top: -3%;
}
#sec4 .sec_right .flex #l1-2 {
  width: 36.42%;
}
#sec4 .sec_right .flex #l1-3 {
  width: 52.31%;
}
@media screen and (max-width: 768px) {
  #sec4 .sec_right {
    /*margin-left: 5%;
        margin-top: 0;
        float: none;
        width:90%;
        font-size: 0;
        .sec_pic{
        	width:50%;
        	
        	display: inline-block;
        }*/
    position: relative;
    top: auto;
    right: auto;
    width: 100%;
  }
}
#sec4 .to-box {
  width: 90%;
  max-width: 1000px;
  margin: auto;
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -ms-flex-wrap: wrap;
  flex-wrap: wrap;
  -webkit-box-pack: justify;
  -ms-flex-pack: justify;
  justify-content: space-between;
  -webkit-box-align: stretch;
  -ms-flex-align: stretch;
  align-items: stretch;
}
#sec4 .to-box *, #sec4 .to-box *:before, #sec4 .to-box *:after {
  -webkit-box-sizing: border-box;
  box-sizing: border-box;
}
#sec4 .to-box img {
  width: 100%;
  height: auto;
}
#sec4 .to-box .img {
  width: 53.5%;
}
#sec4 .to-box .txt {
  width: 46.5%;
  background: #F3F2EA;
  padding: 40px;
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -ms-flex-wrap: wrap;
  flex-wrap: wrap;
  -webkit-box-pack: center;
  -ms-flex-pack: center;
  justify-content: center;
  -webkit-box-align: center;
  -ms-flex-align: center;
  align-items: center;
}
#sec4 .to-box .txt a {
  display: block;
}
#sec4 .to-box .txt img {
  max-width: 291px;
}
@media screen and (max-width: 768px) {
  #sec4 .to-box .img {
    width: 100%;
  }
  #sec4 .to-box .txt {
    width: 90%;
    position: relative;
    z-index: 9;
    margin: -5% auto 0 auto;
    display: block;
    text-align: center;
  }
  #sec4 .to-box .txt .sec_btn {
    width: 100%;
  }
}
/*-----------------------------------

	sec5

------------------------------------*/
#sec5 {
  width: 100%;
  max-width: none;
  padding-bottom: 0;
}
#sec5 .sec_inner {
  background-color: #000000;
  padding-bottom: 0px;
}
#sec5 .sec_visual .sec_copy_txt {
  left: 15%;
  bottom: 2em;
  background-color: #FFFFFF;
  color: #000000;
  z-index: 1;
}
#sec5 .sec_visual .sec_copy_txt br {
  display: none;
}
@media screen and (max-width: 768px) {
  #sec5 .sec_visual .sec_copy_txt {
    top: 1em;
    bottom: auto;
  }
  #sec5 .sec_visual .sec_copy_txt br {
    display: inline;
  }
}
#sec5 .cf {
  width: 100%;
  max-width: 1000px;
  margin-left: auto;
  margin-right: auto;
}
#sec5 .sec_left {
  position: relative;
  margin-left: 5%;
  width: 36%;
  float: left;
}
@media screen and (max-width: 768px) {
  #sec5 .sec_left {
    width: 100%;
    margin-left: 0%;
    float: none;
  }
}
#sec5 .sec_left .sec_text {
  position: static;
  transform: translateY(0px);
  width: 100%;
  max-width: 320px;
  background-color: rgba(0, 0, 0, 0);
}
#sec5 .sec_left .sec_text img {
  max-width: 320px;
}
#sec5 .sec_left .sec_text .sec_btn a {
  background-color: #fff3da;
}
@media screen and (max-width: 768px) {
  #sec5 .sec_left .sec_text {
    width: 90%;
    max-width: none;
    transform: translateY(-30px);
    background-color: black;
  }
}
#sec5 .sec_pic_group1 {
  position: relative;
  width: 100%;
  max-width: 360px;
  margin-left: 10%;
  margin-top: 10px;
}
#sec5 .sec_pic_group1 .sec_pic_group_inner {
  width: 100%;
  overflow: hidden;
}
#sec5 .sec_pic_group1 .sec_pic img {
  width: 100%;
  height: auto;
  display: block;
}
#sec5 .sec_pic_group1 #sec5_pic2 {
  width: 85%;
}
#sec5 .sec_pic_group1 #sec5_pic3 {
  margin-left: 20%;
  width: 85%;
}
@media screen and (max-width: 768px) {
  #sec5 .sec_pic_group1 {
    width: 90%;
    max-width: none;
    margin-left: 5%;
    margin-top: 0px;
    font-size: 0;
  }
  #sec5 .sec_pic_group1 #sec5_pic2 {
    width: 50%;
    display: inline-block;
  }
  #sec5 .sec_pic_group1 #sec5_pic3 {
    width: 50%;
    display: inline-block;
    margin-left: 0%;
  }
}
#sec5 .sec_right {
  width: 45%;
  float: right;
  margin-right: 5%;
  margin-top: 50px;
  position: relative;
}
#sec5 .sec_right .sec_pic img {
  width: 100%;
  height: auto;
  display: block;
}
#sec5 .sec_right .sec_copy_txt {
  left: auto;
  right: 5%;
  bottom: auto;
  top: -2em;
  background-color: #FFFFFF;
  color: #000000;
  z-index: 1;
}
#sec5 .sec_right .sec_copy_txt br {
  display: none;
}
@media screen and (max-width: 768px) {
  #sec5 .sec_right .sec_copy_txt {
    top: -1em;
    bottom: auto;
  }
  #sec5 .sec_right .sec_copy_txt br {
    display: inline;
  }
}
@media screen and (max-width: 768px) {
  #sec5 .sec_right {
    margin-left: 5%;
    margin-top: 0;
    float: none;
    width: 90%;
    font-size: 0;
  }
  #sec5 .sec_right .sec_pic {
    width: 50%;
    display: inline-block;
    overflow: hidden;
  }
  #sec5 .sec_right .sec_pic img {
    width: 140%;
    margin-left: -20%;
  }
}
#sec5 .sec_pic_group2 {
  font-size: 0;
  margin-top: 30px;
  margin-left: auto;
  margin-right: auto;
  width: 100%;
  max-width: 1000px;
}
#sec5 .sec_pic_group2 .sec_pic {
  width: 50%;
  display: inline-block;
}
#sec5 .sec_pic_group2 .sec_pic img {
  width: 100%;
  height: auto;
  display: block;
}
/*-----------------------------------

	sec6

------------------------------------*/
#sec6 {
  width: 100%;
  max-width: none;
  background: #000;
  padding-bottom: 0;
  /*.sec_left{
  	position: relative;
  	margin-left: 5%;
  	width:360/1000 * 100%;
  	float: left;
  	@media screen and (max-width: 768px){
  		width:100%;
  		margin-left: 0%;
  		float: none;
  	}
  	.sec_text{
  		position: static;
  		transform: translateY(-30px);
  		width:100%;
  		max-width:320px;
  		img{max-width:320px;}
  		@media screen and (max-width: 768px){
  			width:90%;
  			max-width: none;
  		}
  	}
  }*/
}
#sec6 .ttl-en {
  color: #fff;
}
#sec6 .sec_inner {
  background-color: #fbead6;
  padding-bottom: 30px;
}
#sec6 .sec_visual .sec_copy_txt {
  left: 10%;
  bottom: auto;
  top: 30%;
  z-index: 1;
}
@media screen and (max-width: 768px) {
  #sec6 .sec_visual .sec_copy_txt {
    top: 5%;
  }
}
#sec6 .cf {
  width: 100%;
  max-width: 1000px;
  margin-left: auto;
  margin-right: auto;
}
#sec6 .sec_right {
  position: relative;
  margin-left: 5%;
  width: 36%;
  float: right;
  /*width:45%;
    float: right;
    margin-right: 5%;
    margin-top: 50px;
    .sec_pic{
    	img{width:100%; height: auto; display: block;}
    }
    @media screen and (max-width: 768px){
    	margin-left: 5%;
    	margin-top: 0;
    	float: none;
    	width:90%;
    	font-size: 0;
    	.sec_pic{
    		width:50%;
    		
    		display: inline-block;
    	}
    }*/
}
@media screen and (max-width: 768px) {
  #sec6 .sec_right {
    width: 100%;
    margin-left: 0%;
    float: none;
  }
}
#sec6 .sec_right .sec_text {
  position: static;
  transform: translateY(-30px);
  width: 100%;
  max-width: 320px;
}
#sec6 .sec_right .sec_text img {
  max-width: 320px;
}
@media screen and (max-width: 768px) {
  #sec6 .sec_right .sec_text {
    width: 90%;
    max-width: none;
  }
}
#sec6 .btn-box {
  text-align: center;
  padding-bottom: 1rem;
}
#sec6 .btn-box .sec_btn a {
  background: #fff;
}
/*-----------------------------------

	sec7

------------------------------------*/
#sec7 {
  width: 100%;
  max-width: none;
}
#sec7 *, #sec7 *:before, #sec7 *:after {
  -webkit-box-sizing: border-box;
  box-sizing: border-box;
}
#sec7 .sec_inner {
  padding-bottom: 10px;
}
#sec7 .sec_visual .sec_copy_txt {
  left: 17%;
  bottom: -30%;
  z-index: 1;
}
@media screen and (max-width: 768px) {
  #sec7 .sec_visual .sec_copy_txt {
    top: 5%;
  }
}
#sec7 .cf {
  width: 100%;
  max-width: 1000px;
  margin-left: auto;
  margin-right: auto;
}
#sec7 .sec_left {
  position: relative;
  margin-left: 5%;
  margin-top: 20px;
  width: 53%;
  float: left;
}
#sec7 .sec_left img {
  width: 100%;
  height: auto;
}
@media screen and (max-width: 768px) {
  #sec7 .sec_left {
    width: 100%;
    margin-left: 0%;
    float: none;
  }
}
#sec7 .sec_right {
  position: relative;
  /*margin-left: 5%;*/
  width: 40%;
  float: right;
}
@media screen and (max-width: 768px) {
  #sec7 .sec_right {
    width: 100%;
    margin-left: 0%;
    float: none;
  }
}
#sec7 .sec_right .sec_text {
  position: static;
  transform: translateY(-30px);
  width: 100%;
  max-width: 350px;
}
#sec7 .sec_right .sec_text img {
  max-width: 350px;
}
@media screen and (max-width: 768px) {
  #sec7 .sec_right .sec_text {
    width: 90%;
    max-width: none;
  }
}
#sec7 .btn-box {
  text-align: center;
  padding-bottom: 1rem;
}
#sec7 .btn-box .sec_btn a {
  background: #fff;
}
#sec7 .img-box {
  position: relative;
}
#sec7 .img-box img {
  width: 100%;
  height: auto;
}
#sec7 .sec07-imglist {
  width: 90%;
  max-width: 900px;
  margin: auto;
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -ms-flex-wrap: wrap;
  flex-wrap: wrap;
  -webkit-box-pack: justify;
  -ms-flex-pack: justify;
  justify-content: space-between;
  -webkit-box-align: stretch;
  -ms-flex-align: stretch;
  align-items: stretch;
}
#sec7 .sec07-imglist .sec07-1-l {
  width: 63.636%;
}
#sec7 .sec07-imglist .sec07-1-r {
  width: 31.818%;
}
@media screen and (max-width: 768px) {
  #sec7 .sec07-imglist .sec07-1-l {
    width: 100%;
  }
  #sec7 .sec07-imglist .sec07-1-r {
    width: 100%;
  }
}
#sec7 .sec07-imglist2 {
  width: 90%;
  max-width: 900px;
  margin: auto;
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -ms-flex-wrap: wrap;
  flex-wrap: wrap;
  -webkit-box-pack: justify;
  -ms-flex-pack: justify;
  justify-content: space-between;
  -webkit-box-align: end;
  -ms-flex-align: end;
  align-items: flex-end;
}
#sec7 .sec07-imglist2 .sec07-2-l {
  width: 31.8181%;
}
#sec7 .sec07-imglist2 .sec07-2-l .sec07-2-l2 {
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -ms-flex-wrap: wrap;
  flex-wrap: wrap;
  -webkit-box-pack: justify;
  -ms-flex-pack: justify;
  justify-content: space-between;
  -webkit-box-align: stretch;
  -ms-flex-align: stretch;
  align-items: stretch;
}
#sec7 .sec07-imglist2 .sec07-2-l .sec07-2-l2 .img-box:first-child {
  width: 51.42857%;
}
#sec7 .sec07-imglist2 .sec07-2-l .sec07-2-l2 .img-box:last-child {
  width: 48.57143%;
}
#sec7 .sec07-imglist2 .sec07-2-r {
  width: 63.6363%;
}
@media screen and (max-width: 768px) {
  #sec7 .sec07-imglist2 .sec07-2-l {
    width: 100%;
  }
  #sec7 .sec07-imglist2 .sec07-2-l .sec07-2-l2 {
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -ms-flex-wrap: wrap;
    flex-wrap: wrap;
    -webkit-box-pack: justify;
    -ms-flex-pack: justify;
    justify-content: space-between;
    -webkit-box-align: stretch;
    -ms-flex-align: stretch;
    align-items: stretch;
  }
  #sec7 .sec07-imglist2 .sec07-2-l .sec07-2-l2 .img-box:first-child {
    width: 51.4%;
  }
  #sec7 .sec07-imglist2 .sec07-2-l .sec07-2-l2 .img-box:last-child {
    width: 48.6%;
  }
  #sec7 .sec07-imglist2 .sec07-2-r {
    width: 100%;
  }
}
#sec7 .lead {
  text-align: center;
  margin-top: 3rem;
  line-height: 2;
}
/*-----------------------------------

	sec8

------------------------------------*/
#sec8 {
  width: 100%;
  max-width: none;
}
#sec8 *, #sec8 *:before, #sec8 *:after {
  -webkit-box-sizing: border-box;
  box-sizing: border-box;
}
#sec8 .img-box {
  position: relative;
}
#sec8 .img-box img {
  width: 100%;
  height: auto;
}
#sec8 .ttl-en2 {
  margin-top: 3rem;
  text-align: center;
  font-size: 18px;
  font-family: "游明朝", "YuMincho", "ヒラギノ明朝 ProN W3", "Hiragino Mincho ProN", "HG明朝E", "ＭＳ Ｐ明朝", "ＭＳ 明朝", serif;
  -webkit-font-smoothing: antialiased;
  font-feature-settings: "palt";
  font-weight: 300;
  -webkit-font-smoothing: antialiased;
  font-feature-settings: "palt";
  transform: rotate(0.001deg);
}
#sec8 .sec_inner {
  padding-bottom: 30px;
  background: #F2E6D6;
}
#sec8 .sec8-box1 {
  width: 90%;
  max-width: 900px;
  margin: 3rem auto 0 auto;
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -ms-flex-wrap: wrap;
  flex-wrap: wrap;
  -webkit-box-pack: justify;
  -ms-flex-pack: justify;
  justify-content: space-between;
  -webkit-box-align: end;
  -ms-flex-align: end;
  align-items: flex-end;
}
#sec8 .sec8-box1 .sec8-1-l {
  width: 54.54545%;
}
#sec8 .sec8-box1 .sec8-1-r {
  width: 40.90909%;
}
#sec8 .sec8-box1 .sec8-1-r .img-box {
  margin-top: 1rem;
}
#sec8 .sec8-box1 .sec8-1-r .sec8-1-ttl {
  text-align: center;
  font-size: 22px;
  font-family: "游明朝", "YuMincho", "ヒラギノ明朝 ProN W3", "Hiragino Mincho ProN", "HG明朝E", "ＭＳ Ｐ明朝", "ＭＳ 明朝", serif;
  -webkit-font-smoothing: antialiased;
  font-feature-settings: "palt";
  font-weight: 300;
  -webkit-font-smoothing: antialiased;
  font-feature-settings: "palt";
  transform: rotate(0.001deg);
}
@media screen and (max-width: 768px) {
  #sec8 .sec8-box1 .sec8-1-l {
    width: 100%;
  }
  #sec8 .sec8-box1 .sec8-1-r {
    width: 100%;
    -webkit-box-ordinal-group: 0;
    -ms-flex-order: -1;
    order: -1;
  }
}
#sec8 .txtbox {
  background: #F3F2EA;
  text-align: center;
}
#sec8 .txtbox img {
  height: auto;
}
#sec8 .sec8-box2 {
  width: 90%;
  max-width: 900px;
  margin: 3rem auto 0 auto;
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -ms-flex-wrap: wrap;
  flex-wrap: wrap;
  -webkit-box-pack: justify;
  -ms-flex-pack: justify;
  justify-content: space-between;
  -webkit-box-align: end;
  -ms-flex-align: end;
  align-items: flex-end;
}
#sec8 .sec8-box2 .sec8-2-l {
  width: 37.27313%;
}
#sec8 .sec8-box2 .sec8-2-l .txtbox {
  padding-top: 1.9rem;
  padding-bottom: 1.9rem;
}
#sec8 .sec8-box2 .sec8-2-l .txtbox img {
  width: 85.82275%;
}
#sec8 .sec8-box2 .sec8-2-r {
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -ms-flex-wrap: wrap;
  flex-wrap: wrap;
  -webkit-box-pack: justify;
  -ms-flex-pack: justify;
  justify-content: space-between;
  -webkit-box-align: stretch;
  -ms-flex-align: stretch;
  align-items: stretch;
  width: 59.09091%;
}
#sec8 .sec8-box2 .sec8-2-r .img-box:first-child {
  width: 46.0%;
}
#sec8 .sec8-box2 .sec8-2-r .img-box:nth-child(2) {
  width: 54.0%;
}
#sec8 .sec8-box2 .sec8-2-r .img-box:last-child {
  width: 100%;
}
@media screen and (max-width: 768px) {
  #sec8 .sec8-box2 .sec8-2-l {
    width: 100%;
  }
  #sec8 .sec8-box2 .sec8-2-r {
    width: 100%;
  }
}
#sec8 .sec8-box3 {
  width: 90%;
  max-width: 900px;
  margin: 3rem auto 0 auto;
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -ms-flex-wrap: wrap;
  flex-wrap: wrap;
  -webkit-box-pack: justify;
  -ms-flex-pack: justify;
  justify-content: space-between;
  -webkit-box-align: end;
  -ms-flex-align: end;
  align-items: flex-end;
}
#sec8 .sec8-box3 .sec8-3-l {
  width: 40.90909%;
}
#sec8 .sec8-box3 .sec8-3-l .txtbox {
  padding-top: 1.9rem;
  padding-bottom: 1.9rem;
}
#sec8 .sec8-box3 .sec8-3-l .txtbox img {
  width: 38.79653%;
}
#sec8 .sec8-box3 .sec8-3-r {
  width: 54.54545%;
}
#sec8 .sec8-box3 .sec8-3-r .txtbox {
  padding-top: 1.9rem;
  padding-bottom: 1.9rem;
}
#sec8 .sec8-box3 .sec8-3-r .txtbox img {
  width: 48.91406%;
}
@media screen and (max-width: 768px) {
  #sec8 .sec8-box3 .sec8-3-l {
    width: 100%;
  }
  #sec8 .sec8-box3 .sec8-3-r {
    width: 100%;
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -ms-flex-wrap: wrap;
    flex-wrap: wrap;
  }
  #sec8 .sec8-box3 .sec8-3-r .img-box {
    -webkit-box-ordinal-group: -1;
    -ms-flex-order: -2;
    order: -2;
  }
}
/*-----------------------------------

	sec9

------------------------------------*/
#sec9 {
  width: 100%;
  max-width: none;
  padding-bottom: 0;
}
#sec9 *, #sec9 *:before, #sec9 *:after {
  -webkit-box-sizing: border-box;
  box-sizing: border-box;
}
#sec9 .img-box {
  position: relative;
}
#sec9 .img-box img {
  width: 100%;
  height: auto;
}
#sec9 .sec_inner {
  background-color: #000000;
  padding-bottom: 0px;
}
#sec9 .sec_visual .sec_copy_txt {
  left: 15%;
  bottom: -8rem;
  background-color: #FFFFFF;
  color: #000000;
  z-index: 1;
}
#sec9 .sec_visual .sec_copy_txt br {
  display: none;
}
@media screen and (max-width: 768px) {
  #sec9 .sec_visual .sec_copy_txt {
    top: 1em;
    bottom: auto;
  }
  #sec9 .sec_visual .sec_copy_txt br {
    display: inline;
  }
}
#sec9 .cf {
  width: 100%;
  max-width: 1000px;
  margin-left: auto;
  margin-right: auto;
}
#sec9 .sec_left {
  position: relative;
  margin-left: 10%;
  width: 31%;
  float: left;
  text-align: center;
}
@media screen and (max-width: 768px) {
  #sec9 .sec_left {
    width: 100%;
    margin-left: 0%;
    float: none;
  }
}
#sec9 .sec_left .sec_text {
  position: static;
  transform: translateY(0px);
  background-color: rgba(0, 0, 0, 0);
}
#sec9 .sec_left .sec_text img {
  max-width: 454px;
}
#sec9 .sec_left .sec_text .sec_btn a {
  background-color: #fff3da;
}
@media screen and (max-width: 768px) {
  #sec9 .sec_left .sec_text {
    width: 90%;
    max-width: none;
    transform: translateY(-30px);
    background-color: black;
  }
}
#sec9 .sec_text {
  width: 100%;
  max-width: 454px;
  margin: auto;
  text-align: center;
  padding: 0;
  padding-top: 40px;
  padding-bottom: 40px;
  padding-right: auto;
  padding-left: auto;
  transform: translateY(-18%);
}
#sec9 .sec_text img {
  width: 59.7754%;
  margin: auto;
}
@media screen and (max-width: 768px) {
  #sec9 .sec_text {
    width: 90%;
    margin: auto;
  }
  #sec9 .sec_text img {
    width: 70%;
  }
}
#sec9 .sec_pic_group1 {
  position: relative;
  width: 100%;
  max-width: 360px;
  margin-left: 10%;
  margin-top: 10px;
}
#sec9 .sec_pic_group1 .sec_pic_group_inner {
  width: 100%;
  overflow: hidden;
}
#sec9 .sec_pic_group1 .sec_pic img {
  width: 100%;
  height: auto;
  display: block;
}
@media screen and (max-width: 768px) {
  #sec9 .sec_pic_group1 {
    width: 90%;
    max-width: none;
    margin-left: 5%;
    margin-top: 0px;
    font-size: 0;
  }
}
#sec9 .sec_right {
  width: 45.40767%;
  float: right;
  margin-right: 5%;
  margin-top: 50px;
  position: relative;
}
#sec9 .sec_right .sec_pic img {
  width: 100%;
  height: auto;
  display: block;
}
#sec9 .sec_right .sec_copy_txt {
  left: auto;
  right: 5%;
  bottom: auto;
  top: -2em;
  background-color: #FFFFFF;
  color: #000000;
  z-index: 1;
}
#sec9 .sec_right .sec_copy_txt br {
  display: none;
}
@media screen and (max-width: 768px) {
  #sec9 .sec_right .sec_copy_txt {
    top: -1em;
    bottom: auto;
  }
  #sec9 .sec_right .sec_copy_txt br {
    display: inline;
  }
}
@media screen and (max-width: 768px) {
  #sec9 .sec_right {
    margin-left: 5%;
    margin-top: 0;
    float: none;
    width: 90%;
    font-size: 0;
  }
  #sec9 .sec_right .sec_pic {
    width: 50%;
    display: inline-block;
    overflow: hidden;
  }
  #sec9 .sec_right .sec_pic img {
    width: 140%;
    margin-left: -20%;
  }
}
#sec9 .sec_pic_group2 {
  font-size: 0;
  margin-top: 30px;
  margin-left: auto;
  margin-right: auto;
  width: 100%;
  max-width: 1000px;
}
#sec9 .sec_pic_group2 .sec_pic {
  width: 50%;
  display: inline-block;
}
#sec9 .sec_pic_group2 .sec_pic img {
  width: 100%;
  height: auto;
  display: block;
}
#sec9 .sec9box-2 {
  width: 90%;
  max-width: 900px;
  margin: 3rem auto 0 auto;
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -ms-flex-wrap: wrap;
  flex-wrap: wrap;
  -webkit-box-pack: justify;
  -ms-flex-pack: justify;
  justify-content: space-between;
  -webkit-box-align: stretch;
  -ms-flex-align: stretch;
  align-items: stretch;
  position: relative;
}
#sec9 .sec9box-2 .sec9-2-l {
  width: 45.40767%;
  position: absolute;
  top: 2rem;
}
#sec9 .sec9box-2 .sec9-2-l .txt9-2 {
  width: 100%;
  background: #F2F1E9;
  text-align: center;
  padding-top: 40px;
  padding-bottom: 40px;
  position: relative;
  z-index: 5;
}
#sec9 .sec9box-2 .sec9-2-l .txt9-2 img {
  width: 54.6255%;
}
#sec9 .sec9box-2 .sec9-2-r {
  width: 59.02997%;
  margin-left: 40.97%;
  text-align: right;
}
#sec9 .sec9box-2 .sec9-2-r .img-box:first-child {
  width: 100%;
}
#sec9 .sec9box-2 .sec9-2-r .img-box:last-child {
  margin-top: 2rem;
  width: 84.6154%;
  margin-left: 15.4%;
}
@media screen and (max-width: 768px) {
  #sec9 .sec9box-2 .sec9-2-l {
    width: 90%;
    position: relative;
    top: auto;
    margin-top: -2rem;
    margin-left: auto;
    margin-right: auto;
    -webkit-box-ordinal-group: 2;
    -ms-flex-order: 3;
    order: 3;
  }
  #sec9 .sec9box-2 .sec9-2-r {
    width: 100%;
    margin-left: auto;
  }
}
#sec9 .sec9box-3 {
  width: 90%;
  max-width: 900px;
  margin: 3rem auto 0 auto;
  padding-bottom: 40px;
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -ms-flex-wrap: wrap;
  flex-wrap: wrap;
  -webkit-box-pack: justify;
  -ms-flex-pack: justify;
  justify-content: space-between;
  -webkit-box-align: stretch;
  -ms-flex-align: stretch;
  align-items: stretch;
}
#sec9 .sec9box-3 .sec9-3-l {
  width: 68.11151%;
}
#sec9 .sec9box-3 .sec9-3-l .txt9-3 {
  width: 60%;
  padding-top: 40px;
  padding-bottom: 40px;
  background: #F2F1E9;
  text-align: center;
  margin: -2% auto 0 5%;
  position: relative;
  z-index: 3;
}
#sec9 .sec9box-3 .sec9-3-l .txt9-3 img {
  width: 66.41982%;
}
#sec9 .sec9box-3 .sec9-3-r {
  width: 27.2446%;
}
#sec9 .sec9box-3 .sec9-3-r .img-box {
  width: 83.3333%;
  position: relative;
}
#sec9 .sec9box-3 .sec9-3-r .img-box:first-child {
  margin: 0 0 0 auto;
  z-index: 3;
}
#sec9 .sec9box-3 .sec9-3-r .img-box:last-child {
  margin: -5% 0 0 0;
}
@media screen and (max-width: 768px) {
  #sec9 .sec9box-3 .sec9-3-l {
    width: 100%;
  }
  #sec9 .sec9box-3 .sec9-3-l .txt9-3 {
    width: 90%;
    margin: -2rem auto 0 auto;
  }
  #sec9 .sec9box-3 .sec9-3-r {
    width: 100%;
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -ms-flex-wrap: wrap;
    flex-wrap: wrap;
    -webkit-box-pack: justify;
    -ms-flex-pack: justify;
    justify-content: space-between;
    -webkit-box-align: stretch;
    -ms-flex-align: stretch;
    align-items: stretch;
    margin-top: 1rem;
  }
  #sec9 .sec9box-3 .sec9-3-r .img-box:first-child {
    width: 53.3333%;
    margin: 0;
  }
  #sec9 .sec9box-3 .sec9-3-r .img-box:last-child {
    width: 46.6667%;
    margin: 0;
  }
}
#sec9 .toi {
  margin: 3rem auto 0 auto;
  text-align: center;
  padding-bottom: 40px;
}
#sec9 .toi a {
  display: block;
  width: 170px;
  margin: auto;
  transition: .3s;
  color: #fff;
  text-decoration: none;
}
#sec9 .toi a:hover {
  opacity: .6;
}
#sec9 .toi a img {
  width: 100%;
  height: auto;
}
#sec9 .toi .lead {
  margin-top: 1rem;
  text-align: center;
  color: #fff;
  line-height: 2;
}
section#bar, section#dog {
  padding-top: 50px;
  padding-bottom: 50px;
  -webkit-box-sizing: border-box;
  box-sizing: border-box;
}
section#bar *, section#bar *:before, section#bar *:after, section#dog *, section#dog *:before, section#dog *:after {
  -webkit-box-sizing: border-box;
  box-sizing: border-box;
}
section#bar .sec_btn, section#dog .sec_btn {
  width: 100%;
}
section#bar .sec_btn a, section#dog .sec_btn a {
  width: 120px;
  display: block;
  padding: 0.25em 0;
  color: #221815;
  font-weight: bold;
  text-align: center;
  font-size: 15px;
  border: 2px solid #c3b191;
  border-radius: 2em;
  text-decoration: none;
  margin: 30px auto 0;
  background: #fff;
}
section#bar img, section#dog img {
  width: 100%;
  height: auto;
}
section#bar .s-inner, section#dog .s-inner {
  width: 90%;
  max-width: 1000px;
  margin: auto;
}
section#bar h4, section#dog h4 {
  text-align: center;
}
section#bar .s-box, section#dog .s-box {
  width: 100%;
  position: relative;
}
section#bar .txtbox, section#dog .txtbox {
  background: #F3F2EA;
  padding-top: 30px;
  padding-bottom: 30px;
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -ms-flex-wrap: wrap;
  flex-wrap: wrap;
  -webkit-box-pack: center;
  -ms-flex-pack: center;
  justify-content: center;
  -webkit-box-align: center;
  -ms-flex-align: center;
  align-items: center;
}
#bar {
  background: #000;
}
#bar h4 {
  color: #fff;
  padding-bottom: 50px;
}
#bar .logo-bar {
  max-width: 340px;
  margin: auto;
}
#bar .s-box {
  margin-top: 50px;
}
#bar .s-box .b-txt {
  width: 40.5%;
  padding-top: 10%;
  padding-bottom: 10%;
}
#bar .s-box .b-txt img {
  max-width: 258px;
}
#bar .s-box .b1-1 {
  width: 40.5%;
  position: relative;
  z-index: 9;
}
#bar .s-box .b1-2 {
  width: 60%;
  position: absolute;
  top: 0;
  right: 0;
}
#bar .s-box .b1-3 {
  width: 60%;
  position: absolute;
  bottom: 0;
  right: 0;
  z-index: 10;
}
#bar .bar-p {
  width: 90%;
  margin: auto;
  text-align: center;
  color: #fff;
  padding-top: 50px;
  padding-bottom: 50px;
}
#bar .img-paty {
  width: 100%;
}
#bar .img-paty .txt {
  width: 90%;
  max-width: 1000px;
  margin: 0 auto;
  position: relative;
}
#bar .img-paty .txt img {
  position: absolute;
  top: 0;
  right: 0;
  max-width: 93px;
}
@media screen and (max-width: 768px) {
  #bar .s-box {
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -ms-flex-wrap: wrap;
    flex-wrap: wrap;
  }
  #bar .s-box .b-txt {
    width: 90%;
    margin: auto;
    margin-top: -5%;
    position: relative;
    z-index: 10;
  }
  #bar .s-box .b1-1 {
    width: 100%;
  }
  #bar .s-box .b1-2 {
    width: 100%;
    -webkit-box-ordinal-group: -2;
    -ms-flex-order: -1;
    order: -1;
    position: relative;
    right: auto;
    top: auto;
  }
  #bar .s-box .b1-3 {
    position: relative;
    bottom: auto;
    right: auto;
    width: 100%;
  }
  #bar .bar-p {
    font-size: .9rem;
  }
  #bar .img-paty .txt img {
    max-width: 54px;
  }
}
#dog {
  background: #D1E1AA;
}
#dog .s-box {
  margin-top: 50px;
}
#dog .s-box .d-txt {
  width: 40%;
  padding-top: 30px;
  text-align: center;
  position: relative;
  z-index: 9;
}
#dog .s-box .d-txt .txtbox {
  padding-bottom: 20%;
}
#dog .s-box .d-txt .d-txt-img {
  max-width: 256px;
}
#dog .s-box .d-txt .d1-1 {
  margin: -5% auto 0 auto;
  width: 90%;
  max-width: 318px;
}
#dog .s-box .d1-2 {
  width: 63.6%;
  position: absolute;
  right: 0;
  top: 0;
}
#dog .s-box .d1-3 {
  width: 28.5%;
  position: absolute;
  right: 0;
  bottom: 0;
  z-index: 6;
}
@media screen and (max-width: 768px) {
  #dog .s-box {
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -ms-flex-wrap: wrap;
    flex-wrap: wrap;
  }
  #dog .s-box .d1-2 {
    width: 100%;
    position: relative;
    right: auto;
    top: auto;
    -webkit-box-ordinal-group: -2;
    -ms-flex-order: -1;
    order: -1;
  }
  #dog .s-box .d-txt {
    padding-top: 0;
    margin-top: -5%;
    width: 100%;
  }
  #dog .s-box .d-txt .txtbox {
    width: 90%;
    margin: auto;
    padding-bottom: 30px;
  }
  #dog .s-box .d-txt .d1-1 {
    width: 100%;
    margin-top: 0;
    max-width: 100%;
  }
  #dog .s-box .d1-3 {
    position: relative;
    right: auto;
    bottom: auto;
    width: 100%;
  }
}
/*-----------------------------------

	bnr-space

------------------------------------*/
.bnr-area {
  text-align: center;
  padding: 3rem 0 0;
}
.bnr-area .inner {
  margin: 0 auto;
  width: 94%;
  /*
		@media screen and (max-width: 768px){
			width:360px;
		}
		@media screen and (max-width: 480px){
			width:300px;
		}
    */
}
.bnr-area .inner .ttl {
  margin-bottom: .5rem;
  font-size: 22px;
  line-height: 130%;
}
@media screen and (max-width: 480px) {
  .bnr-area .inner .ttl {
    font-size: 18px;
  }
}
.bnr-area .inner .txt {
  margin-top: .5rem;
  font-size: .9rem;
  line-height: 130%;
}
.bnr-area .inner li {
  display: inline-block;
  vertical-align: top;
  text-align: center;
  width: 48%;
  max-width: 470px;
  margin: 0 1% 2rem;
}
@media screen and (max-width: 640px) {
  .bnr-area .inner li {
    width: 100%;
    margin: 0 auto 2rem;
  }
}
.bnr-area .inner li a {
  /*padding: 15px 0 0;*/
  display: block;
  text-decoration: none;
  border: 1px solid #000000;
  max-width: 420px;
  margin: auto;
  /*
        @media screen and (max-width: 768px){
          width:360px;
        }
        @media screen and (max-width: 480px){
          width:300px;
        }
        */
}
.bnr-area .inner li a p {
  font-size: 12px;
  width: 100%;
  background-color: black;
  color: #FFFFFF;
  padding: 0.5em 0;
}
.bnr-area .inner li a img {
  width: 100%;
  height: auto;
}
/*-----------------------------------

	cafe-access

------------------------------------*/
.cafe-access {
  max-width: 1000px;
  width: 100%;
  background: #DED1B6;
  -webkit-box-sizing: border-box;
  box-sizing: border-box;
  padding: 1rem 2rem;
  margin: 4rem auto;
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -ms-flex-wrap: wrap;
  flex-wrap: wrap;
  -webkit-box-align: start;
  -ms-flex-align: start;
  align-items: flex-start;
  -webkit-box-pack: justify;
  -ms-flex-pack: justify;
  justify-content: space-between;
}
.cafe-access .ttl-en {
  width: 100%;
  margin: 2rem 0;
  text-align: center;
}
.cafe-access .cafe-acc-list {
  width: calc(100% - (600px + 1rem));
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -ms-flex-wrap: wrap;
  flex-wrap: wrap;
  -webkit-box-pack: justify;
  -ms-flex-pack: justify;
  justify-content: space-between;
}
.cafe-access .cafe-acc-list a {
  color: #000;
  text-decoration: none;
}
@media screen and (max-width: 900px) {
  .cafe-access .cafe-acc-list {
    margin-left: auto;
    margin-right: auto;
    width: 100%;
    max-width: 600px;
  }
}
@media screen and (max-width: 768px) {
  .cafe-access .cafe-acc-list {
    width: 100%;
  }
}
.cafe-access .cafe-acc-list li {
  font-size: .9rem;
  margin-bottom: .5rem;
  letter-spacing: .1rem;
}
.cafe-access .cafe-acc-list li.rs-acc-txt {
  line-height: 1.8;
}
.cafe-access .cafe-acc-list li.cafe-acc-img {
  width: 100%;
  margin-bottom: 30px;
}
.cafe-access .cafe-acc-list li.cafe-acc-img img {
  width: 100%;
  height: auto;
}
.cafe-access .cafe-acc-list li.cafe-acc-img .logo-cafe {
  max-width: 235px;
}
.cafe-access .cafe-acc-list li.cafe-acc-img .logo-bar {
  max-width: 175px;
  margin-top: 10px;
}
.cafe-access .cafe-acc-list li.cafe-acc-txt {
  width: 100%;
}
.cafe-access .cafe-acc-list li.cafe-acc-txt .note {
  display: inline-block;
  margin-bottom: 1rem;
}
.cafe-access .cafe-acc-list li.cafe-acc-txt.form a {
  padding-bottom: 3px;
  border-bottom: solid 1px #614C3F;
}
.cafe-access .cafe-acc-list li.cafe-acc-ttl {
  width: 23%;
}
.cafe-access .cafe-acc-list li.cafe-acc-con {
  width: 75%;
}
.cafe-access .cafe-acc-list li.form a {
  padding-bottom: 3px;
  border-bottom: solid 1px #614C3F;
}
.cafe-access .cafe-map {
  width: 600px;
  margin-bottom: 2rem;
}
@media screen and (max-width: 900px) {
  .cafe-access .cafe-map {
    margin-left: auto;
    margin-right: auto;
    width: 100%;
    margin-top: 1rem;
    max-width: 600px;
  }
}
@media screen and (max-width: 768px) {
  .cafe-access .cafe-map {
    width: 100%;
    margin-top: 1rem;
  }
}
.cafe-access .cafe-map iframe {
  max-width: 100%;
}
.cafe-access .caution {
  width: 100%;
  font-size: .625rem;
  margin-top: 2rem;
  line-height: 2;
}
.cafe-access .social-area {
  width: 100%;
  padding: 10px 0;
  text-align: center;
}
.cafe-access .social-area li {
  width: 40px;
  display: inline-block;
  margin: 5px;
}
.cafe-access .social-area li a {
  display: block;
}
.cafe-access .social-area li img {
  width: 100%;
  height: auto;
  display: block;
}
.kikokoti {
  width: 90%;
  max-width: 415px;
  margin: auto;
}
.kikokoti img {
  width: 100%;
  height: auto;
}
.btn-list {
  width: 90%;
  max-width: 1000px;
  margin: auto;
  padding-bottom: 3rem;
  -webkit-box-sizing: border-box;
  box-sizing: border-box;
}
.btn-list *, .btn-list *:before, .btn-list *:after {
  -webkit-box-sizing: border-box;
  box-sizing: border-box;
}
.btn-list a {
  width: 100%;
  display: block;
  margin-top: 1rem;
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -ms-flex-wrap: wrap;
  flex-wrap: wrap;
  -webkit-box-pack: justify;
  -ms-flex-pack: justify;
  justify-content: space-between;
  -webkit-box-align: stretch;
  -ms-flex-align: stretch;
  align-items: stretch;
  transition: .3s;
}
.btn-list a:hover {
  opacity: .6;
}
.btn-list a .img-box {
  width: 50%;
  position: relative;
}
.btn-list a .img-box img {
  width: 100%;
  height: auto;
}
.btn-list a .btn-txt {
  width: 50%;
  background: #614C3F;
  position: relative;
}
.btn-list a .btn-txt .txt {
  position: absolute;
  top: 50%;
  left: 50%;
  transform: translate(-50%, -50%);
  color: #fff;
  text-align: center;
  line-height: 2;
  letter-spacing: .1rem;
}
@media screen and (max-width: 768px) {
  .btn-list a .img-box {
    width: 100%;
  }
  .btn-list a .btn-txt {
    width: 100%;
    text-align: center;
    padding: 1rem;
  }
  .btn-list a .btn-txt .txt {
    position: relative;
    top: auto;
    left: auto;
    transform: none;
  }
}
/* =========================================== */
/* 2号店 */
/* =========================================== */
.cafe2 .mainBox .mainCopy .maincopy-ja {
  font-size: 36px;
}
@media screen and (max-width: 768px) {
  .cafe2 .mainBox .mainCopy .maincopy-ja {
    font-size: 20px;
  }
}
.cafe2 .ttl-en {
  text-align: center;
  margin-bottom: 30px;
  margin-top: 30px;
}
.cafe2 .sec_copy_txt {
  position: absolute;
  bottom: -2em;
  left: 5%;
  font-size: 18px;
  background-color: black;
  padding: 20px 10px;
  color: #FFFFFF;
  /*-webkit-writing-mode:vertical-rl;
      -ms-writing-mode:tb-rl;
          writing-mode:vertical-rl;*/
}
.cafe2 .sec_copy_txt img {
  width: 18px;
  height: auto;
}
@media screen and (max-width: 768px) {
  .cafe2 .sec_copy_txt {
    bottom: auto;
    top: -1em;
    font-size: 16px;
  }
  .cafe2 .sec_copy_txt img {
    width: 16px;
  }
}
@media screen and (max-width: 600px) {
  .cafe2 .sec_copy_txt {
    top: -1em;
    left: 2%;
    font-size: 14px;
  }
  .cafe2 .sec_copy_txt img {
    width: 14px;
  }
}
@media screen and (max-width: 480px) {
  .cafe2 .sec_copy_txt {
    font-size: 12px;
    padding: 10px 7.5px;
  }
  .cafe2 .sec_copy_txt img {
    width: 12px;
  }
}
@media screen and (max-width: 380px) {
  .cafe2 .sec_copy_txt {
    font-size: 10px;
    padding: 10px 5px;
  }
  .cafe2 .sec_copy_txt img {
    width: 10px;
  }
}
.cafe2 .img img {
  width: 100%;
  height: auto;
}
.cafe2 #sec2-1 .sec_text {
  width: 360px;
  top: 15%;
  transform: none;
}
.cafe2 #sec2-1 .sec_text img {
  max-width: 360px;
}
@media screen and (max-width: 768px) {
  .cafe2 #sec2-1 .sec_text {
    width: 90%;
  }
}
.cafe2 #sec2-1 .sec_photo {
  background-image: url("../images/02/img01.jpg");
}
.cafe2 #sec2-1 .img2 {
  width: 450px;
  margin: 0 0 0 auto;
}
@media screen and (max-width: 768px) {
  .cafe2 #sec2-1 .img2 {
    width: 90%;
    margin: auto;
  }
}
@media screen and (max-width: 768px) {
  .cafe2 #sec2-1 {
    padding-top: 40px;
  }
}
.cafe2 #sec2-2 {
  background: #fbead6;
  padding-bottom: 20%;
}
@media screen and (max-width: 768px) {
  .cafe2 #sec2-2 {
    padding-bottom: 2rem;
  }
}
.cafe2 #sec2-2 .sec-main {
  width: 100%;
  position: relative;
}
.cafe2 #sec2-2 .sec-main .sec_copy_txt {
  bottom: 0;
  left: auto;
  right: 5%;
}
.cafe2 #sec2-2 .sec_text {
  width: 480px;
  padding: 0;
  top: 10%;
  transform: none;
}
.cafe2 #sec2-2 .sec_text img {
  max-width: 480px;
}
.cafe2 #sec2-2 .sec_text .txt {
  padding: 40px;
}
@media screen and (max-width: 768px) {
  .cafe2 #sec2-2 .sec_text {
    width: 90%;
  }
  .cafe2 #sec2-2 .sec_text .txt {
    padding-right: 0;
    padding-left: 0;
  }
}
.cafe2 #sec2-2 .sec_photo {
  background-image: url("../images/02/img04.jpg");
}
.cafe2 #sec2-3 {
  background: #fbead6;
  padding-bottom: 20%;
}
@media screen and (max-width: 768px) {
  .cafe2 #sec2-3 {
    padding-bottom: 2rem;
  }
}
.cafe2 #sec2-3 .sec-main {
  width: 100%;
  position: relative;
}
.cafe2 #sec2-3 .sec-main .sec_copy_txt {
  bottom: 0;
  left: auto;
  right: 5%;
}
.cafe2 #sec2-3 .sec_text {
  width: 480px;
  padding: 0;
  top: -20%;
  left: 50%;
  transform: translateX(-50%);
  /*transform: none;*/
}
.cafe2 #sec2-3 .sec_text img {
  max-width: 480px;
}
.cafe2 #sec2-3 .sec_text .txt {
  padding: 40px;
}
@media screen and (max-width: 768px) {
  .cafe2 #sec2-3 .sec_text {
    width: 90%;
    margin-top: 20px;
  }
  .cafe2 #sec2-3 .sec_text .txt {
    padding-right: 0;
    padding-left: 0;
  }
}
@media screen and (max-width: 768px) {
  .cafe2 #sec2-3 .sec_photo {
    display: none;
  }
}
.cafe2 #sec2-4 {
  background: #fbead6;
  padding-bottom: 15%;
}
@media screen and (max-width: 768px) {
  .cafe2 #sec2-4 {
    padding-bottom: 2rem;
  }
}
.cafe2 #sec2-4 .sec-main {
  width: 100%;
  position: relative;
}
.cafe2 #sec2-4 .sec-main .sec_copy_txt {
  bottom: 10;
  left: auto;
  right: 5%;
  z-index: 10;
  background: #000;
}
.cafe2 #sec2-4 .sec_text {
  width: 480px;
  padding: 0;
  top: 10%;
  transform: none;
}
.cafe2 #sec2-4 .sec_text img {
  max-width: 480px;
}
.cafe2 #sec2-4 .sec_text .txt {
  padding: 40px;
}
@media screen and (max-width: 768px) {
  .cafe2 #sec2-4 .sec_text {
    width: 90%;
  }
  .cafe2 #sec2-4 .sec_text .txt {
    padding-right: 0;
    padding-left: 0;
  }
}
.cafe2 #sec2-4 .sec_photo {
  background-image: url("../images/02/img10.jpg");
  position: relative;
  z-index: -1;
}
.cafe2 .btn-box {
  padding-top: 30px;
  padding-bottom: 30px;
  margin: 0;
  width: 100%;
  background: #fbead6;
}
.cafe2 .btn-box .sec_btn span a {
  width: 120px;
  display: block;
  padding: 0.25em 0;
  color: #000;
  font-weight: bold;
  text-align: center;
  font-size: 15px;
  border: 2px solid #3E231E;
  border-radius: 2em;
  text-decoration: none;
  margin: 0 auto;
  opacity: 1;
}.cafe2 .btn-box .sec_btn span a:hover {
background: #AD775F;
color: #fff;
}
.cafe2 #dog {
  background: #D1E1AA;
}
.cafe2 #dog .c-box {
  width: 100%;
  position: relative;
}
.cafe2 #dog .c-box img {
  height: auto;
}
.cafe2 #dog .c-box .txt12 {
  width: 40%;
  background: #F3F2EA;
  padding-top: 30px;
  padding-bottom: 30px;
  margin-top: 5%;
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -ms-flex-wrap: wrap;
  flex-wrap: wrap;
  -webkit-box-pack: center;
  -ms-flex-pack: center;
  justify-content: center;
  -webkit-box-align: center;
  -ms-flex-align: center;
  align-items: center;
  position: relative;
  z-index: 9;
}
.cafe2 #dog .c-box .txt12 img {
  max-width: 337px;
}
.cafe2 #dog .c-box .img12-1 {
  width: 74.4%;
  position: absolute;
  top: 0;
  right: 0;
}
.cafe2 #dog .c-box .img12-2 {
  width: 40%;
  position: relative;
  z-index: 9;
}
.cafe2 #dog .c-box .img12-3 {
  width: 35%;
  position: absolute;
  right: 0;
  bottom: 0;
}
.cafe2 #dog .btn-box {
  background: none;
}
.cafe2 #dog .btn-box .sec_btn a {
  margin-top: 0;
  background: #fff;
}
@media screen and (max-width: 768px) {
  .cafe2 #dog .c-box {
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -ms-flex-wrap: wrap;
    flex-wrap: wrap;
  }
  .cafe2 #dog .c-box .txt12 {
    width: 100%;
  }
  .cafe2 #dog .c-box .img12-1 {
    position: relative;
    right: auto;
    top: auto;
    width: 100%;
    -webkit-box-ordinal-group: 4;
    -ms-flex-order: 3;
    order: 3;
  }
  .cafe2 #dog .c-box .img12-2 {
    width: 50%;
    -webkit-box-ordinal-group: 1;
    -ms-flex-order: 0;
    order: 0;
  }
  .cafe2 #dog .c-box .img12-3 {
    width: 50%;
    position: relative;
    bottom: auto;
    right: auto;
    -webkit-box-ordinal-group: 2;
    -ms-flex-order: 1;
    order: 1;
  }
}
.cafe2 .cafe-access .rs-acc-list {
  width: calc(100% - (600px + 1rem));
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -ms-flex-wrap: wrap;
  flex-wrap: wrap;
  -webkit-box-pack: justify;
  -ms-flex-pack: justify;
  justify-content: space-between;
}
@media screen and (max-width: 768px) {
  .cafe2 .cafe-access .rs-acc-list {
    width: 100%;
  }
}
.cafe2 .cafe-access .rs-acc-list li {
  font-size: .7rem;
  margin-bottom: .5rem;
  letter-spacing: .1rem;
}
.cafe2 .cafe-access .rs-acc-list li.rs-acc-txt {
  width: 100%;
}
.cafe2 .cafe-access .rs-acc-list li.rs-acc-txt .logo {
  width: 90%;
  margin: auto;
  padding-bottom: 10px;
  max-width: 235px;
}
.cafe2 .cafe-access .rs-acc-list li.rs-acc-txt .logo img {
  width: 100%;
  height: auto;
}
.cafe2 .cafe-access .rs-acc-list li.rs-acc-ttl {
  width: 43%;
}
.cafe2 .cafe-access .rs-acc-list li.rs-acc-con {
  width: 55%;
}
.cafe2 .cafe-access .rs-acc-list li.rs-acc-note {
  width: 100%;
  font-size: 0.625rem;
}
.cafe2 .cafe-access .rs-acc-list li.form a {
  padding-bottom: 3px;
  border-bottom: solid 1px #614C3F;
}
.cafe2 .cafe-access .root {
  width: 100%;
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -ms-flex-wrap: wrap;
  flex-wrap: wrap;
  -webkit-box-pack: justify;
  -ms-flex-pack: justify;
  justify-content: space-between;
  -webkit-box-align: stretch;
  -ms-flex-align: stretch;
  align-items: stretch;
  font-size: .95rem;
  color: #362A25;
}
.cafe2 .cafe-access .root img {
  width: 100%;
  height: auto;
}
.cafe2 .cafe-access .root .map-bus {
  width: 49%;
  margin-top: 1rem;
}
.cafe2 .cafe-access .root .ac-img {
  width: 49%;
  margin-top: 1rem;
}
@media screen and (max-width: 768px) {
  .cafe2 .cafe-access .root .map-bus {
    width: 100%;
  }
  .cafe2 .cafe-access .root .ac-img {
    width: 100%;
  }
}
.cafe2 a {
  color: #111;
  text-decoration: none;
}
.mt30 {
  margin-top: 60px;
}
@media screen and (max-width: 768px) {
  .cafe2 .float-box a, .cafe2 .float-box span {
    width: 100%;
  }
  .float-box a, .float-box span {
    width: 100% !important;
  }
  .sphd {
    display: none !important;
  }
}

/* =========================================== */
/* 3号店 津田沼店 */
/* =========================================== */

.cafe3 .contents {
overflow: hidden;
}
.cafe3 #calender {
width: 90%;
max-width: 1200px;
margin: 0 auto;
}
.cafe3 .sec_box {
display: flex;
justify-content: space-between;
flex-wrap: wrap;
position: relative;
margin-bottom: 4rem;
}

.cafe3 #wide {
width: 100%;
background:  #FAE4CD;
}
.cafe3 #sec2 {
max-width: 1200px;
width: 90%!important;
margin: 0 auto 6rem;
}

.cafe3 #sec2 .sec_photo {
    width: 70%;
    height: 640px;
    background-image: url("../images/03/img01.png");
    background-size: cover;
    background-position: center center;
    margin-left: 0;
}
.cafe3 #sec2 .sec_text {
width: 30%;
top: 24%;
right: 0;
transform: unset;
left: auto;
position: absolute;
background-color: #f6f5ec;
padding: 40px;
}
.cafe3 #sec2 .sec_text img {
max-width: 300px;
}

.cafe3 #sec3 {
max-width: 1200px;
width: 90%;
margin: 0 auto 8rem ;
padding-bottom: 10rem;
overflow: hidden;
}
#sec3 .sec_photo {
background-image: none;
}
.cafe3 #sec3 .sec_text {
margin-right: auto;
width: 50%;
background: #f6f5ec;
padding: 3rem;
position: relative;
}
/*
.cafe3 #sec3 .sec_text {
width: 35%;
transform: unset;
left: 0;
right: auto;
position: absolute;
background-color: #f6f5ec;
padding: 40px 40px 40px 60px;
margin-top: 4rem;
margin-left: clamp(5rem, -11.867rem + 35.09vw, 32rem);
margin-right: clamp(5rem, -11.867rem + 35.09vw, 32rem);
}
.cafe3 #sec3 .sec_text a {
border: solid 1px #c3a890;
border-radius: 40px;
text-align: center;
padding: 0.3rem 3rem;
font-size: 1.2vw;
display: block;
width: 8vw;
margin-top: 2rem;
color: #222;
transition : 0.5s;
}
.cafe3 #sec3 .sec_text a:hover {
background: #c3a890;
color: #fff;
}
*/
.cafe3 #sec3 .sec_text img {
width: 40%;

}
.cafe3 #sec3 .sec_photo {
width: 70%;
position: absolute;
top: 2rem;
right: 0;
}
.cafe3 #sec3 .sec_photo img {
width: 100%;
}

.cafe3 #sec10 {
margin-bottom: 4rem;
background: linear-gradient(180deg, #fff 0%, #fff 50%, #d1e1a9 50%, #d1e1a9 100%);
display: flex;
justify-content: center;
align-items: center;
width: 100%;
height: auto;
padding-bottom: 50px;
}
.cafe3 #sec10 .inner {
padding-bottom: 50px;
margin: auto;
max-width: 1200px;
width: 90%;
}
.cafe3 #sec10 .sec_box {
display:block;
}
.cafe3 #sec10 .sec_photo {
width: 65%;
height: 400px;
background-image: url("../images/03/img05.png");
background-size: cover;
background-position: center center;
margin-left: auto;
}
.cafe3 #sec10 .sec_text {
width: 34%;
top: 30%;
left: 0;
z-index: 10;
transform: unset;
position: absolute;
background-color: #f6f5ec;
padding: 40px;
}
.cafe3 #sec10 .sec_text img {
max-width: 300px;
width: 90%;
}

.cafe3 #sec11 {
width: 90%;
max-width: 1200px;
margin: 0 auto;
padding-bottom: 8rem;
position: relative;
}
.cafe3 #sec11 .sec_wrap {
    width: 20%;
    transform: unset;
    right: 0;
    left: auto;
    position: relative;
    background-color: none;
    padding: 40px 40px 40px 60px;
    margin-top: 4rem;
    margin-right: clamp(5rem, -11.867rem + 35.09vw, 32rem);
    margin-left: clamp(5rem, -11.867rem + 35.09vw, 32rem);
    z-index: -1;
    text-align: center;
}
.cafe3 #sec11 .sec_text {
width: 40%;
margin: 0 auto;
text-align: center;
background-color: #f6f5ec;
padding: 40px;
}
/*
.cafe3 #sec11 .sec_text {
width: 20%;
transform: unset;
right: 0;
left: auto;
position: absolute;
background-color: #f6f5ec;
padding: 40px 40px 40px 60px;
margin-top: 4rem;
margin-right: clamp(5rem, -11.867rem + 35.09vw, 32rem);
margin-left: clamp(5rem, -11.867rem + 35.09vw, 32rem);
text-align: center;
}
*/

.cafe3 #sec11 .sec_btn a {
position: relative;
border: solid 1px #c3a890;
border-radius: 40px;
text-align: center;
padding: 0.3rem 0;
font-size: 1vw;
display: block;
width: 8vw;
color: #222;
transition : 0.5s;
margin: 2rem auto 0;
}
.cafe3 #sec11 .sec_btn a:hover {
background: #c3a890;
color: #fff;
}
.cafe3 #sec11 .sec_text img {
max-width: 230px;
width: 90%;
}
.cafe3 #sec11 .sec_photo {
width: 90%;
margin: 0 auto;
position: static;
z-index: 1;
}
.cafe3 #sec11 .sec_photo img {
width: 100%;
}

.cafe3 #sec4 {
background-color: #ffffff!important;
}
.cafe3 #sec4 .sec_inner {
background-color: #ffffff!important;
}
.cafe3 #sec4 .sec_left .sec_text {
  position: static;
  transform: translateY(-30px);
  width: 65%;
  padding-right: 40%;
}
.cafe3 #sec4 .sec_right {
  position: absolute;
  top: -28%;
  right: 0;
  width: 56%;
}
.cafe3 #sec4 .cf {
padding-bottom: 0;
}

.cafe3 #sec12 {
background: #fbead6;
margin-bottom: 4rem;
}
.cafe3 #sec12 ul {
display: flex;
flex-wrap: wrap;
justify-content: space-between;
}
.cafe3 #sec12 li {
width: 50%;
display: flex;
justify-content: center;
align-items: center;
}
.cafe3 #sec12 li .image {
margin: 0;
}
.cafe3 #sec12 li .image img {
width: 100%;
height: auto
}
.cafe3 #sec12 dl {
display: flex;
flex-direction: column;
padding: 2rem;
width: 80%;
}
.cafe3 #sec12 li dt {
margin-bottom: 5vw;
text-align: center;
}
.cafe3 #sec12 .sec_text {
    position: static;
    transform: translateY(-30px);
    width: 80%;
    padding: 3rem;
    background-color: #f6f5ec;
}
.cafe3 #sec12 .sec_text img {
width: 90%;
max-width: 300px;
}
.cafe3 .cafe-access .cafe-acc-list li.rs-acc-txt {
margin-bottom: 2rem;
}
.cafe3 .cafe-access .cafe-acc-list li .phone {
border: solid 2px #614c3f;
display: flex;
flex-direction: column;
justify-content: center;
align-items: center;
margin-bottom: 2rem;
}
.cafe3 .cafe-access .cafe-acc-list li .phone dt {
padding: .5rem 0;
font-size: 24px;
font-weight: bold;
color: #614c3f;
}
.cafe3 .cafe-access .cafe-acc-list li .phone dd {
background-color: #614c3f;
color: #fff!important;
font-size: 24px;
width: 100%;
text-align: center;
padding: .5rem 0;
font-weight: bold;
}
.cafe3 .cafe-access .cafe-acc-list a.tel {
color: #fff;
background-image: url(../images/03/tel_icon.svg);
background-position: left center;
background-repeat: no-repeat;
background-size: 8%;
padding-left: 2rem;
}
.cafe3 .cafe-access .cafe-acc-list li .sns {
display: flex;
justify-content: space-between;
flex-wrap: wrap;
align-items: center;
}
.cafe3 .cafe-access .cafe-acc-list li .sns dt {
width: 100%;
font-size: 18px;
text-align: center;
margin-bottom: 1.5rem;
}
.cafe3 .cafe-access .cafe-acc-list li .sns dd {
width: 48%;
}
.cafe3 .cafe-access .cafe-acc-list li .sns a {
width: 40%;
display: block;
margin: 0 auto;
}

.cafe3 .cafe-access .cafe-map .root {
text-align: right;
}
.cafe3 .cafe-access .cafe-map iframe {
  max-width: 100%;
  margin-bottom: 2rem;
}
@media screen and (min-width: 769px) {
.cafe3 .cafe-access .cafe-acc-list a.tel {
pointer-events: none;
}
}
@media screen and (max-width: 768px) {
.cafe3 #sec2 {
margin-bottom: 2rem;
}
.cafe3 #sec2 .sec_photo {
width: 100%;
height: auto;
background-image: url("../images/03/img01_sp.png");
}
.cafe3 #sec2 .sec_text {
    width: 80%;
    position: static;
    margin: 0 auto;
    z-index: 10;
    padding: 40px 20px;
}
.cafe3 #sec3 {
padding-bottom: 0rem;
margin-bottom: 4rem;
}
.cafe3 #sec3 .sec_box {
flex-direction:column-reverse;
justify-content: center;
flex-wrap: nowrap;
}
.cafe3 #sec3 .sec_text {
    width: 100%;
    position: static;
    margin: 15rem auto 0;
    padding: 40px 20px 20px;
}
.cafe3 #sec3 .sec_photo {
width: 100%;
margin: 0 auto;
}
.cafe3 #sec3 .sec_text a {
width: 50%;
margin: 2rem auto;
padding: 0.5rem 2.5rem;
font-size: 14px;
}
.cafe3 #sec3 .sec_text img {
    width: 50%;
}
.cafe3 #sec10 {
margin-bottom: 10rem;
}
.cafe3 #sec10 .sec_photo {
width: 100%;
height: 200px;
margin: 0 auto;
background-image: url("../images/03/img05_sp.png");
}
.cafe3 #sec10 .sec_text {
width: 70%;
top: 90%;
}

.cafe3 #sec11 {
padding-bottom: 0;
}
.cafe3 #sec11 .sec_text {
width: 80%;
position: static;
margin: 0 auto;
padding: 40px 20px 20px;
}
.cafe3 #sec11 .sec_photo {
width: 90%;
margin: 0 auto;
}
.cafe3 #sec11 .sec_text a {
width: 50%;
margin: 2rem auto;
padding: 0.5rem 2.5rem;
font-size: 14px;
position: relative;
z-index: 10;
}

.cafe3 #sec4 .sec_right {
top: -58%;
}
.cafe3 #sec4 .sec_left .sec_text {
margin-top: 8rem;
}
#sec4 .sec_left .sec_text img {
max-width: 375px;
width: 90%;
}
/*
#sec4 .sec_left .sec_text img {
max-width: 500px;
width: 100%;
margin-left: 2rem;
}
*/
.cafe3 #sec12 li {
width: 100%;
}
.cafe3 #sec12 li dt {
margin-bottom: 4rem;
}
.cafe3 #sec12 .sec_text {
width: 90%;
padding: 40px 20px;
margin: 0 auto;
}

.cafe3 .cafe-access .cafe-map .root {
text-align: center;
}
.cafe3 .cafe-access .cafe-map .root img {
width: 100%;
}

}