@charset "utf-8";
/* CSS Document */

/*============================
嵜本珈琲用のCSS(PC用)
============================*/
img { margin: 0; padding: 0; vertical-align: bottom; }
.center { text-align: center; }
.c-ttl-head.sakimoto-coffee {
    background: url(../images/sakimoto-coffee/photo_main_ttl.jpg) no-repeat center;
    background-size: cover;
    padding: 500px 0 200px;
}
.sp_only { display: none; }
#section_01, #section_02, #section_03, #section_04, #section_05, #section_06, #section_07 { font-family: 'Noto Serif JP', serif; }

/*====== section_01 ======*/
#section_01 { padding: 6% 0; margin: 0 0 10% 0; }
#section_01 h2 {
	text-align: center;
	font-size: 2.2em;
    font-weight: 700;
    letter-spacing: 2.5px;
	line-height: 1.8;
	margin-bottom: 2%;
}
.links_btn { 
	overflow: hidden;
    max-width: 1000px;
    margin: 2% auto 0;
    padding: 0 0 0 7%; 
}
.links_btn_L { float: left; }
.links_btn p {
	float: left;
	font-size: 1.8em;
    margin: 7% 4% 0;
}
.links_btn_R { float: right; }
.links_btn_or { 
	float: left;
    margin: 8% 0 0 5%;
    font-size: 1.2em;
}

/*====== section_02 ラテベース======*/
#section_02 {
	background-color: #e98e6f;
	text-align: center;
	position: relative;
	min-height: 2600px;
}
@media screen and (max-width: 2560px) {
  #section_02 {
    min-height: 2350px;
  }
}
@media screen and (max-width: 1920px) {
  #section_02 {
    min-height: 2600px;
  }
}
@media screen and (max-width: 1366px) {
  #section_02 {
    min-height: 1300px;
  }
}
@media screen and (max-width: 1280px) {
  #section_02 {
    min-height: 1200px;
  }
}

.latte_base {
	position: absolute;
    top: -200px;
    left: 50%;
    transform: translateX(-50%);
    -webkit-transform: translateX(-50%);
    -ms-transform: translateX(-50%);
}

/*====== section_03 ======*/
#section_03 {
	background-color: #e3e3df;
	text-align: center;
	padding: 6% 0;
}

/*====== section_04 ======*/
#section_04 {
	text-align: center;
	padding: 3% 0;
}
.onlin_store_btn img { width: 80%; }

/*====== section_05 ======*/
#section_05 {
	background-color: #e3e3df;
	text-align: center;
	padding: 6% 0;
}

/*====== section_06 ======*/
#section_06 { 
	text-align: center;
	padding: 8% 0;
}
#section_06 h2{ 
	text-align: center;
	font-size: 2.2em;
    font-weight: 500;
    letter-spacing: 2.5px;
	line-height: 2;
	margin-bottom: 2%;
}
#section_06 p { 
	text-align: center;
	font-size: 1.4em;
	letter-spacing: 1.6px;
	line-height: 2;
	margin-bottom: 8%;
}
#section_06 .cafe_link {
	margin-top: 5%;
}
#section_06 .cafe_link a {
	color: #ffffff;
    background-color: #e98e6f;
    padding: 1% 2%;
	border-radius: 40px;
}
#section_06 .cafe_link a br { display: none; }

/*====== section_07 店舗情報======*/
#section_07 { 
	background-color: #e3e3df;
	text-align: center;
	padding: 6% 0;
}
#section_07 h2 {
	font-size: 2.2em;
    font-weight: 500;
    letter-spacing: 2.5px;
}
#section_07 .content-area {
	width: 1200px;
	overflow: hidden;
	margin: 0 auto;
}
#section_07 .tennpo-image {
	margin: 5% 0;
}
#section_07 .left-area {
	float: left;
	overflow: hidden;
}
#section_07 .left-area h3 {
	text-align: left;
	font-size: 2em;
	font-weight: 500;
	letter-spacing: 2px;
	margin-bottom: 15%;
}
#section_07 .left-area dl { 
	margin-bottom: 10%; 
	overflow: hidden;
}
#section_07 .left-area dl dt, #section_07 .left-area dl dd {
	text-align: left;
	font-size: 1.4em;
	letter-spacing: 1.6px;
	line-height: 1.6;
	float: left;
}
#section_07 .right-area {
	float: right;
}
#section_07 .right-area .map iframe {
    width: 600px;
    height: 450px;
}

/*=============
コーヒー豆ページ
=============*/
.p-c-ttl-head coffeelist {
  overflow: hidden;
  padding-top: 45px;
  margin-bottom: 25px;
  border-top: 1px solid #9F764A;
}
.p-coffeelist {
  padding-top: 125px;
  margin-bottom: 80px;
}
.p-coffeelist:first-of-type {
  border-top: none;
  padding-top: 0;
}

/*box*/
.p-coffeelist-box {
  padding-bottom: 100px;
}
.p-coffeeist-box:nth-child(3) .p-coffeelist-box__photo {
  margin-left: -100px;
}
.p-coffeelist-box__photo {
  position: relative;
  width: calc(100% + 100px);
}
.p-coffeelist-box__icon.p-icon-week {
  top: -50px;
  left: 0;
}
.p-coffeelist-box__contents {
  padding-top: 0;
  position: relative;
}
.p-coffeelist-box__name {
  color: #9F764A;
  font-size: 30px;
  font-size: 1.875rem;
  margin-bottom: 25px;
}
.p-coffeelist-box__text {
  color: #9F764A;
  max-width: 600px;
}
.p-coffeelist-box__btn {
  margin-top: 0;
  position: absolute;
  top: 0;
  right: 0;
  width: 100%;
  max-width: 330px;
}
.p-coffeelist-box__btn .c-basic-btn {
  max-width: 330px;
}

/*mini*/
.p-coffeelist-mini {
  text-align: center;
  margin-bottom: 50px;
  margin-top: 50px;
}
.p-coffeelist-mini__photo {
  position: relative;
}
.p-coffeelist-mini__icon.p-icon-week {
  top: -25px;
  left: 0;
}
.p-coffeelist-mini__contents {
  padding: 15px;
}
.p-coffeelist-mini__name {
  color: #9F764A;
  font-size: 16px;
  font-size: 1rem;
  margin-bottom: 10px;
}
.p-coffeelist-mini__text {
  color: #9F764A;
  font-size: 14px;
  font-size: 0.875rem;
}

/*==================
single
==================*/
.p-coffee-mainvisual__list {
  margin-bottom: 70px;
}
.p-coffee-mainvisual__list .slick-dots {
  display: flex;
  justify-content: center;
  margin-top: 30px;
}
.p-coffee-mainvisual__list .slick-dots li {
  width: 15px;
  height: 15px;
  border-radius: 15px;
  background: #E8C5B7;
  margin-right: 15px;
}
.p-coffee-mainvisual__list .slick-dots li.slick-active {
  background: #9F764A;
}
.p-coffee-mainvisual__list .slick-dots li button {
  display: none;
}

/*ttl=================*/
.p-coffee-ttl {
  text-align: center;
}
.p-coffee-ttl__sub {
  color: #D8C7B6;
  font-size: 1.25rem;
  margin-bottom: 20px;
  display: inline-block;
  padding: 5px 20px;
}
.p-coffee-ttl__name {
  color: #9F764A;
  font-size: 40px;
  font-size: 2.5rem;
  margin-top: 35px;
}
.p-coffee-ttl__pay {
  margin-top: 25px;
}
.p-coffee-ttl__pay .in {
  display: inline-block;
  font-size: 20px;
  font-size: 1.25rem;
  color: #9F764A;
  background: #EFEEE8;
  padding: 15px 20px;
}
.p-coffee-ttl__text {
  margin-top: 35px;
  color: #9F764A;
}

/*info=================*/
.p-coffee-info {
  padding-top: 100px;
  text-align: center;
}

/* =====================
   コーヒー豆ページ - テーブルとフレーバー画像（PC版）
===================== */
.coffee-table_and_chart {
  display: flex;
  align-items: center; /* 上下中央揃え */
  justify-content: space-between;
  flex-direction: row-reverse;
  gap: 40px;
  margin: 40px 0;
}

.table-coffee-info {
  flex: 1;
  display: flex;
  align-items: center; /* テーブル自体も上下中央 */
}

.table-coffee-info table {
  width: 100%;
  margin: 0;
  border-collapse: collapse;
}

/* テーブル内のセルも上下中央揃え */
.table-coffee-info table th,
.table-coffee-info table td {
  padding: 12px 15px;
  text-align: left;
  border: 1px solid #9F764A;
  vertical-align: middle;
}

.table-coffee-info table th {
  font-weight: 400;
  background-color: #f5f5f5;
  width: 30%;
}

.table-coffee-info table td {
  width: 70%;
}

.coffee-flavor-img {
  flex: 1;
  display: flex;
  align-items: center; /* 画像を上下中央に */
  justify-content: center;
}

.coffee-flavor-img img {
  max-width: 100%;
  height: auto;
}

.p-coffee-info__ttl {
  color: #9F764A;
  font-size: 24px;
  font-size: 1.5rem;
  line-height: 1.6;
  margin-bottom: 35px;
}
.p-coffee-info__text {
  color: #9F764A;
  margin-bottom: 35px;
  text-align: left;
}
.p-coffee-info__sub {
  color: #9F764A;
}

/*btn=================*/
.p-coffee-btn {
  margin-top: 50px;
  text-align: center;
}
.p-coffee-btn__item {
  margin-bottom: 10px;
  display: inline-block;
  padding: 0 10px;
  width: 100%;
  max-width: 300px;
}

/*--ここまでに記載する=======================-*/