@charset "UTF-8";

* {
  margin: 0;
  padding: 0;
  box-sizing: border-box;
}

html {
  font-size: 62.5%;
  font-family: "Noto Sans JP", sans-serif;
  font-weight: 400;
  color: #333;
  letter-spacing: 0.1em;
}

body {
  font-size: 1.5rem;
  line-height: 1.8;
}

.bg_body {
  overflow-x: hidden;
}

body.top_sp_bg::before {
  content: "";
  display: block;
  position: fixed;
  top: 0;
  left: 0;
  z-index: -1;
  width: 100%;
  height: 100vh;
  /*    background: url(../images/bg-para@2x.png) center no-repeat;*/
  /*    background-size: cover;*/
}

.container-concept,
main {
  width: 85%;
  margin: 0 auto;
}

main {
  margin-bottom: 100px;
}

header.headerArea {
  position: relative;
  height: 10vw;
  overflow: hidden;
  margin: 0 auto;
}

.header__bg {
  position: absolute;
  top: 0;
  bottom: 0;
  right: 0;
  left: 0;
  width: 100%;
  height: 100%;
  background-color: #ada69f;
  transform: skewY(2.8deg);
  transform-origin: top right;
}

.pageHeadArea {
  margin-top: 30px;
  margin-bottom: 25px;
  text-align: center;
}

img.pageHead {
  width: 100%;
}

/* ------------------ハンバーガーメニュー--------------------*/
.hNav {
  position: relative;
}

.nav-drawer__checkbox {
  display: none;
}

.nav-drawer__icon {
  /*    background-color: #000;*/
  cursor: pointer;
  display: block;
  width: 56px;
  height: 60px;
  position: fixed;
  top: 0;
  right: 0;
  z-index: 4;
}

.nav_toggle {
  display: block;
  position: relative;
  width: 80%;
  height: 3.5rem;
  top: 20px;
}

.nav_toggle i {
  display: block;
  width: 100%;
  height: 6px;
  background-color: #fff;
  position: absolute;
  transition: transform 0.5s, opacity 0.5s;
  border: 1px solid;
}

.nav_toggle i:nth-child(1) {
  top: 0;
}

.nav_toggle i:nth-child(2) {
  top: 0;
  bottom: 0;
  margin: auto;
}

.nav_toggle i:nth-child(3) {
  bottom: 0;
}

#drawerCheckbox:checked ~ .nav-drawer__icon .nav_toggle i:nth-child(2) {
  background: transparent;
  border: transparent;
}

#drawerCheckbox:checked ~ .nav-drawer__icon .nav_toggle i:nth-child(1) {
  -webkit-transform: rotate(-45deg);
  transform: rotate(-45deg);
  top: 0;
}

#drawerCheckbox:checked ~ .nav-drawer__icon .nav_toggle i:nth-child(3) {
  -webkit-transform: rotate(45deg);
  transform: rotate(45deg);
  top: 0;
}

#drawerCheckbox:checked ~ .nav-drawer__icon .nav_toggle {
  top: 35px;
}

.nav-drawer__overlay {
  background-color: #333;
  opacity: 0;
  pointer-events: none;
  width: 100%;
  height: 100%;
  position: fixed;
  top: 0;
  right: 0;
  z-index: 2;
}

.nav-drawer__menu {
  background: #ada69f;
  color: #fff;
  max-width: 100%;
  width: 280px;
  height: 100vh;
  overflow-y: auto;
  -webkit-overflow-scrolling: touch;
  position: fixed;
  top: 0;
  right: -280px;
  z-index: 3;
  padding: 7vh 40px;
}

ul.h-menu {
  list-style-type: none;
  display: flex;
  flex-direction: column;
}

.nav-drawer__menu_logo {
  text-align: center;
  margin-bottom: 40px;
}

.nav-drawer__menu_logo_img {
  width: 60%;
}

.h-menu > li {
  display: block;
  width: 100%;
  text-align: center;
}

.h-menu > li:not(:first-child) {
  margin-top: 30px;
}

.h-menu a {
  color: #fff;
  text-decoration: none;
  font-size: 1.9rem;
  font-weight: 800;
  display: block;
  padding-top: 10px;
  padding-bottom: 10px;
}

.nav-drawer__menu > ul > a:visited {
  color: #fff;
}

.h-snsList {
  display: flex;
  justify-content: center;
  list-style-type: none;
  margin-top: 40px;
}

.h-snsList li {
  width: 40px;
  height: 40px;
  background-color: #fff;
  border-radius: 50%;
  display: flex;
  justify-content: center;
  align-items: center;
}

.h-snsList li:not(:last-of-type) {
  margin-right: 1rem;
}

.h-snsList li a {
  display: flex;
  justify-content: center;
  align-items: center;
  width: 100%;
  height: 100%;
}

.h-snsList > li > a img {
  width: 55%;
}

/*
#drawerCheckbox:checked ~ .nav-drawer__icon > span {
    background: transparent;
}

#drawerCheckbox:checked ~ .nav-drawer__icon > span:before {
    -webkit-transform: rotate(-45deg);
    transform: rotate(-45deg);
    top: 0;
}

#drawerCheckbox:checked ~ .nav-drawer__icon > span:after {
    -webkit-transform: rotate(45deg);
    transform: rotate(45deg);
    top: 0;
}
*/

#drawerCheckbox:checked ~ label.nav-drawer__overlay {
  opacity: 0.3;
  pointer-events: auto;
}

#drawerCheckbox:checked ~ nav.nav-drawer__menu {
  right: 0;
}

/* WEB予約ボタン */
.reservation {
  position: fixed;
  z-index: 5;
  left: 3vw;
  top: 15px;
}

.reservation a {
  background-color: #fff;
  border: 1px solid #333;
  width: 60px;
  height: 60px;
  border-radius: 50%;
  position: relative;
  display: block;
}

.reservation span {
  color: #333;
  position: absolute;
  display: inline-block;
  left: 0;
  top: 50%;
  width: 60px;
  text-align: center;
  -webkit-transform: translateY(-50%);
  transform: translateY(-50%);
  font-weight: 500;
  z-index: 6;
  font-size: 1.5rem;
  line-height: 1.2;
}

/* ------------------PC用ヘッダー分--------------------*/
.pcHeaderText,
.otherHeader {
  display: none;
}

/* ------------------メインビジュアル--------------------*/
.mv {
  text-align: center;
  max-width: 327px;
  margin: 20px auto 10px;
  width: 85%;
  position: relative;
}

h1 img {
  width: 100%;
  border-radius: 10px;
}

.logo {
  position: absolute;
  right: 15px;
  top: 100px;
  text-align: right;
  background-color: rgba(255, 255, 255, 0.5);
  backdrop-filter: blur(5px);
  -webkit-backdrop-filter: blur(5px);
  border-radius: 8px;
  padding: 10px 15px;
}

.logo img {
  display: block;
  width: 150px;
}

.logo p {
  color: #333333;
  font-size: 1.1rem;
  letter-spacing: 0.1em;
  display: inline;
  text-align: center;
}

.headSection:not(:first-of-type) {
  margin-top: 72px;
}

.head {
  width: 100%;
  margin-bottom: 20px;
}

.mv-pc,
.head-pc {
  display: none;
}

/*---------- SP用グロナビ -------------*/

nav.mainNav {
  display: none;
}

/*---------- Concept -------------*/

.container-concept {
  padding-top: 30px;
  padding-bottom: 40px;
}

.container-concept p {
  text-align: justify;
}

/*---------- Saloninfo -------------*/

.mainAc {
  position: relative;
}

/*
.mainAc:after {
font-family: "Font Awesome 5 Free";
content: '\f078';
font-weight: 900;
font-size: 5rem;
position: absolute;
right: 5%;
top: 18%;
transition: all 0.2s ease-in-out;
transform: rotate(135deg);
-webkit-transform: rotate(135deg);
}
*/

.mainAc:after {
  position: absolute;
  right: 5%;
  top: 23%;
  transition: all 0.3s ease-in-out;
  display: block;
  font-family: "Font Awesome 5 Free";
  content: "\f078";
  font-weight: 900;
  font-size: 2.5rem;
}

.mainAc.open:after {
  -webkit-transform: rotate(180deg);
  transform: rotate(180deg);
  top: 23%;
}

.main-inner {
  padding: 0 15px 0;
  display: none;
}

.salon_flex,
.salon_flex2 {
  display: flex;
  flex-direction: column;
}

.salonMv > img {
  width: 100%;
  border-radius: 50%;
}

.information img {
  width: 10px;
  margin-right: 10px;
}

.information dt {
  font-size: 1.5rem;
  margin-top: 25px;
  margin-bottom: 6px;
  font-weight: 400;
}

.information_mark {
  background-color: #ada69f;
  width: 10px;
  height: 10px;
  display: inline-block;
  margin-right: 10px;
  transform: skew(-15deg);
}

.information dd {
  font-size: 1.5rem;
  text-align: justify;
}

.telArea {
  margin-top: 25px;
  text-align: center;
  font-size: 2rem;
  font-weight: 700;
}

.telArea > a {
  color: #333;
  text-decoration: none;
}

.tel_ic {
  margin-right: 5px;
  font-size: 2rem !important;
}

.salon_map_link {
  font-size: 1.3rem;
}

.information dd > p > a {
  color: #333;
  border: 1px solid #333;
  padding: 1px 10px;
  text-decoration: none;
  display: inline-block;
  margin-top: 5px;
  text-align: center;
  transition: all 0.3s;
}

.information dd > p > a:hover {
  color: #fff;
  background-color: #333;
}

.gMap {
  margin-top: 50px;
  height: 240px;
}

.salon_calender {
  font-size: 1.2rem;
  margin-top: 30px;
}

.salon_calender a {
  text-decoration: none;
  color: inherit;
}

table.isp-calendar-inner td {
  padding: 8px;
}

/* xo event calendar 初期化 */
.xo-event-calendar table.xo-month {
  border: none !important;
  margin: 0 !important;
}

.xo-event-calendar table.xo-month td,
.xo-event-calendar table.xo-month th {
  border: none !important;
}

/* xo event calendar 初期化 ここまで */

/* xo event calendar デザイン調整 */
/*フォント変更*/
#calendar-design {
  font-family: "Noto Sans JP", sans-serif;
}

/*行間の調整*/
#calendar-design .month-dayname div,
#calendar-design .month-week {
  line-height: 1.8em;
  height: 2.4em;
  padding: 3px;
  text-align: center;
}

/*前月の日付を削除*/
#calendar-design .other-month {
  display: none;
}

/*休日の表示を変更*/
/* #calendar-design .holiday-all {
  background-color: #fff !important;
  color: #c1272d;
} */

/*スペース調整*/
#calendar-design td,
#calendar-design .month-dayname-space {
  line-height: auto;
  height: 0;
  background-color: #ffffff;
}

/*文字を真ん中に */
#calendar-design .month-header > span {
  font-weight: 500;
  text-align: center;
  margin: 0px;
  padding: 0;
  color: #333;
}

#calendar-design .month-header {
  margin: 8px 0;
}

/* ボタンの透明度の初期値の解除*/
#calendar-design button[disabled] {
  opacity: 1;
}

/* 前後に戻るボタン */
#calendar-design .nav-prev,
#calendar-design .nav-next {
  border: none;
  display: inline-block;
  font-size: 0;
  height: 16px;
  transform: none;
  width: 16px;
  cursor: pointer;
}

/* aタグボタンの濃さ */
#calendar-design .nav-prev a,
#calendar-design .nav-next a {
  opacity: 1;
}

/* 次に進む画像設定 */
#calendar-design .nav-next {
  background: transparent url(../images/btn_nxt.png) right center no-repeat;
}
/* 前に戻る画像設定 */
#calendar-design .nav-prev {
  background: transparent url(../images/btn_prv_off.png) right center no-repeat;
}

/* ボタンの横幅解除 */
#calendar-design button {
  width: auto;
}

/* 文字の色 */
#calendar-design .sunday,
#calendar-design .saturday,
#calendar-design .today,
#calendar-design table,
#calendar-design th {
  color: #333;
  font-weight: 400;
  font-size: 1em;
}
#calendar-design th {
  font-weight: 500 !important;
  padding: 3px 0 !important;
  text-align: center;
}

/* 定休日回り調整 */
#calendar-design .holiday-titles {
  display: flex;
  flex-wrap: wrap;
}

#calendar-design .holiday-title {
  font-size: 0.8em;
  float: left;
  margin: 0;
  padding: 5px 10px 5px 0;
}

#calendar-design .holiday-title span {
  margin: 3px 3px 0 0;
  padding: 0 0 0 15px;
  border: none;
}

/* xo event calendar デザイン調整 ここまで */

/*---------- Topics -------------*/
.topicsIndex {
  list-style-type: none;
  line-height: 2;
}

.topicsIndex li:not(:first-child) {
  margin-top: 48px;
}

.topicsIndex a {
  display: block;
  text-decoration: none;
  color: #333;
  transition: all 0.3s;
}

.topicsIndex a:hover {
  opacity: 0.5;
}

.topicsIndex > li > a > span.category {
  color: #fff;
  background-color: #333;
  padding: 1px 5px;
  font-weight: 500;
  margin-right: 1em;
  font-size: 1.3rem;
}

.topicsIndex > li > a > span.category:last-of-type {
  margin-right: 0;
}

.place {
  padding-left: 10px;
  padding-right: 10px;
  font-weight: 700;
}

.date {
  display: inline-block;
  font-weight: 500;
  padding-bottom: 10px;
}

.top-topicsLine {
  display: block;
  border: 1px solid #edeae7;
}

.title {
  display: block;
  padding-top: 10px;
  line-height: 1.5;
  text-align: justify;
}

.more {
  margin: 48px auto 30px;
  text-align: center;
}

.more_link {
  display: inline-block;
  text-decoration: none;
  color: #fff;
  font-size: 1.4rem;
  background-color: #333;
  border-radius: 50%;
  line-height: 70px;
  text-align: center;
  width: 70px;
  height: 70px;
  border: 1px solid rgba(0, 0, 0, 0);
  transition: all 0.3s;
}

.more_link:hover {
  color: #333;
  border: 1px solid #333;
  background-color: #fff;
}

.fas,
.arrow_right {
  font-size: 1rem;
  padding-left: 5px;
}

/*---------- Campaign -------------*/

/*
.lead {
text-align: center;
margin-bottom: 20px;
letter-spacing: 0.05em;
}


.campaign-contents {
border: 1px solid #333;
padding: 40px 15px 28px;
border-radius: 10px;
position: relative;
box-shadow: 2px 3px 3px 1px rgba(51, 51, 51, 0.65);
}

.campaign-contents:not(:first-child) {
margin-top: 20px;
}

.campaign-contents ul {
list-style-type: none;
}

.campaignBox {
margin-bottom: 10px;
}

.campaignImg {
width: 100%;
height: auto;
border-radius: 10px;
}

.campaignTitle {
font-size: 1.7rem;
font-weight: 500;
margin-bottom: 5px;
letter-spacing: 0.05em;
line-height: 1.5;
}


.campaignDeadline {
text-align: right;
font-size: 1.2rem;
margin-bottom: 10px;
letter-spacing: 0.05em;
}

.campaignComment {
font-size: 1.4rem;
line-height: 1.4;
margin-bottom: 15px;
letter-spacing: 0.05em;
text-align: justify;
}

.campaignObi {
width: 100%;
height: 18px;
background-color: #ada69f;
border-radius: 9px 9px 0 0;
position: absolute;
top: 0;
left: 0;
}

.CampaignChui {
letter-spacing: 0.05em;
}
*/

/*---------- Menu -------------*/
.menu_inner {
  padding: 0 30px;
}

.menu-head {
  font-size: 1.8rem;
  font-weight: 700;
  margin-top: 20px;
}

.lead {
  text-align: center;
  margin-bottom: 20px;
  letter-spacing: 0.05em;
}

.menuList {
  display: flex;
  flex-wrap: wrap;
}

.line {
  height: 3px;
  background: linear-gradient(
    -60deg,
    transparent 55%,
    #ada69f 65%,
    #ada69f 75%,
    transparent 85%
  );
  background-size: 4px 4px;
  border: none;
  margin-top: 10px;
  margin-bottom: 10px;
}

.container-menu dt {
  width: 72%;
  margin-bottom: 10px;
  line-height: 1.5;
}

.container-menu dd {
  width: 28%;
  text-align: right;
  line-height: 1.5;
}

/* --------------------------インスタグラム-------------------------- */

.container-insta {
  text-align: center;
}

.head-insta {
  text-align: center;
  position: relative;
}

.insta {
  width: 100%;
}

.head-insta p {
  /*
    position: absolute;
    left: 0;
    right: 0;
*/
  margin: auto;
  top: 3.2%;
}

.instaPhotoArea {
  width: 100%;
  margin: auto;
  /*    margin-top: 40px;*/
  overflow: hidden;
}

.instaPhotoArea > div {
  float: left;
  width: 162px;
  margin-bottom: 3px;
  box-sizing: border-box;
}

.instaPhotoArea > div:not(:nth-child(2n)) {
  margin-right: 3px;
}

.instaPhotoArea > div > img {
  width: 100%;
  height: auto;
}

/* --------------------------Faq------------------------- */

.faqContainer li {
  list-style-type: none;
  margin-bottom: 15px;
}

.faq-question {
  background-color: #edeae7;
  border-radius: 10px;
  padding: 9px;
  line-height: 1.8;
  text-align: justify;
}

.inner {
  display: none;
  padding: 10px;
  letter-spacing: 0.08em;
  text-align: justify;
  line-height: 1.5;
}

.qMark {
  display: inline-block;
  color: #fff;
  font-weight: 500;
  background-color: #333;
  width: 25px;
  height: 25px;
  border-radius: 50%;
  text-align: center;
  margin-right: 5px;
  line-height: 25px;
}

footer {
  color: #fff;
  background-color: #ada69f;
  text-align: center;
  margin-top: 80px;
  height: auto;
  padding-bottom: 56px;
  display: flex;
  flex-direction: column;
  align-items: center;
  position: relative;
}

footer::before {
  content: "";
  position: absolute;
  height: 120px;
  width: 300%;
  background: #ada69f;
  top: -30px;
  left: -100%;
  -webkit-transform: rotate(-2.2deg);
  -ms-transform: rotate(-2.2deg);
  -o-transform: rotate(-2.2deg);
  transform: rotate(-2.2deg);
}

.footer_container {
  width: 85%;
}

footer p {
  margin-top: 10px;
  margin-bottom: 20px;
  position: relative;
}

footer img {
  width: 200px;
}

small {
  font-size: 1rem;
  position: relative;
}

/* ----------contactフォームページ用------------- */

/* iOSでのデフォルトスタイルをリセット */
input[type="submit"],
input[type="reset"] {
  -webkit-appearance: none;
  -webkit-border-radius: 0px;
}

/* jsで、iOSでのtextareaのデフォルトスタイルをリセット */
.ios.safari textarea {
  text-indent: -3px each-line;
}

/*必須*/
.hissu {
  color: #ff0000;
  font-size: 1rem;
  font-weight: 400;
}

/*各項目マージン*/
.formArea p {
  margin-bottom: 15px;
}

/*テキストボックス*/
.formArea input {
  font-size: 100%;
  width: 100%;
  padding: 5px;
}

/*項目名*/
.formArea .item_name {
  display: block;
  text-align: left;
  margin-bottom: 5px;
}

/*テキストエリア*/
.formArea textarea {
  padding: 5px;
  max-width: 100%;
  min-width: 100%;
  font-size: 100%;
}

.formArea input[type="reset"],
.formArea input[type="submit"] {
  width: 130px;
  height: 40px;
  font-size: 1.2rem;
  border-radius: 10px;
}

/*承認*/
.wpcf7-list-item-label {
  line-height: 1.5;
  font-size: 1.2rem;
}

.formArea input[type="checkbox"] {
  width: initial;
  vertical-align: middle;
}

.form_confirm {
  text-align: center;
}

/*エラー文*/
span.wpcf7-not-valid-tip {
  margin-top: 5px;
  font-size: 1.2rem !important;
}

/*リセット・送信ボタン*/
.form_button {
  text-align: center;
  margin-top: 40px;
}

.formArea input[type="reset"] {
  background-color: #fff;
  color: #333;
  border: 1px solid #333;
  margin-right: 10px;
}

.formArea input[type="submit"] {
  background-color: #333;
  color: #fff;
  border: none;
}

/*response*/
div.wpcf7-response-output {
  margin: 0 !important;
  margin-top: 2em !important;
  padding: 0.5em 1em !important;
  text-align: center;
  border-color: #ada69f !important;
  font-size: 1.2rem;
  margin-bottom: 2em !important;
  line-height: 1.5;
}

/*承諾チェックボックス*/
span.wpcf7-list-item {
  margin: 0 !important;
}

/* -------------SP追従電話をかけるボタン---------------- */

.spTel {
  position: fixed;
  top: 80px;
  right: 0;
  text-align: center;
}

.spTel a {
  width: 20px;
  height: 20px;
  padding: 10px 10px 7px;
  background-color: #fff;
  color: #333;
  text-decoration: none;
  font-size: 1.6rem;
  border-radius: 10px 0 0 10px;
  border-left: 1px solid #333;
  border-top: 1px solid #333;
  border-bottom: 1px solid #333;
}

/* -----------------------Topics用------------------ */

.topicsIndex > li > span.category {
  color: #fff;
  background-color: #333;
  padding: 1px 5px;
  font-weight: 500;
  margin-right: 1em;
}

.topicsIndex > li > span.category:last-of-type {
  margin-right: 0;
}

.topics-indexTitle {
  margin-top: 10px;
  margin-bottom: 10px;
  font-size: 1.7rem;
  font-weight: 500;
}

.topics-photo {
  max-width: 100%;
  margin-top: 20px;
}

.topics-line {
  border: 1px solid #edeae7;
  margin-top: 10px;
  margin-bottom: 10px;
}

.topics-sectionLine {
  margin-top: 20px;
}

/* アーカイブエリア */

.topics-SortArea {
  text-align: center;
  margin-top: 50px;
}

.archiveHead {
  font-size: 1.6rem;
  margin-top: 0;
  margin-bottom: 10px;
  background-color: #edeae7;
  font-weight: bold;
  padding: 5px;
}

.archive-salons,
.archive-year {
  display: inline-block;
  font-size: 1.5rem;
}

.archive-salons {
  list-style-type: none;
  display: flex;
  padding-bottom: 30px;
  justify-content: center;
  flex-wrap: wrap;
}

.archive-salons li {
  margin-bottom: 10px;
}

.archive-year li {
  margin-left: 20px;
  margin-bottom: 10px;
}

.archive-salons li:not(:last-child):after {
  display: inline-block;
  content: "";
  background-color: #dcdcdc;
  width: 0.5px;
  height: 1.5rem;
  border-top: 2px solid #dcdcdc;
  transform: rotate(35deg);
  transform-origin: right center;
  margin-left: 10px;
  margin-right: 10px;
  margin-bottom: -4px;
}

.archive-salons a {
  text-decoration: none;
  color: #333;
}

.archive-month {
  display: none;
  list-style-type: none;
}

.archive-year li:hover {
  cursor: pointer;
}

.archive-month li a {
  text-decoration: none;
  color: #333;
}

/*ページャー*/
.pager {
  margin-top: 40px;
}

/* ---------------パララックス--------------- */
.paralax {
  position: relative;
  overflow: hidden;
  margin: 0;
  background-color: #fff;
}

.paralax2 {
  padding-bottom: 0;
}

.topBg {
  position: relative;
  overflow: hidden;
  height: 300px;
  box-sizing: border-box;
}

.topBg::before {
  content: "";
  position: absolute;
  height: 100px;
  width: 300%;
  background: #fff;
  top: -100px;
  left: -100px;
  -webkit-transform: rotate(-2.8deg);
  -ms-transform: rotate(-2.8deg);
  -o-transform: rotate(-2.8deg);
  transform: rotate(-2.8deg);
}

.topBg:after {
  content: "";
  position: absolute;
  height: 100px;
  width: 300%;
  background: #fff;
  bottom: -60px;
  left: -100px;
  -webkit-transform: rotate(2.8deg);
  -ms-transform: rotate(2.8deg);
  -o-transform: rotate(2.8deg);
  transform: rotate(2.8deg);
}

.snsNav {
  display: none;
}

/*pageTopボタン*/
#pageTop {
  position: fixed;
  bottom: 20px;
  right: 20px;
}

#pageTop a {
  display: block;
  opacity: 0.7;
  z-index: 999;
  padding: 12px;
  background: #333;
  color: #fff;
  font-weight: bold;
  text-decoration: none;
  text-align: center;
  font-size: 2rem;
  transform: skew(-15deg);
  -webkit-transform: skew(-15deg);
  -webkit-transition: all 0.2s cubic-bezier(0.77, 0.2, 0.05, 1);
  transition: all 0.2s cubic-bezier(0.77, 0.2, 0.05, 1);
  -webkit-transition-timing-function: cubic-bezier(0.77, 0.2, 0.05, 1);
  transition-timing-function: cubic-bezier(0.77, 0.2, 0.05, 1);
  border: 1px solid rgba(0, 0, 0, 0);
}

#pageTop a:hover {
  text-decoration: none;
  background-color: #fff;
  color: #333;
  border: 1px solid #333;
}

/* ========= ▲▲▲▲▲for iPhone Landscape　(for iPad&PC)▲▲▲▲▲ ========= */
@media screen and (min-width: 751px) {
  /*  共通  */

  .pcHeaderText,
  .otherHeader {
    max-width: 900px;
    display: block;
    position: relative;
    margin: 0 auto;
    text-align: right;
    padding: 0 24px;
    padding-top: 1%;
    font-size: 1.1rem;
    letter-spacing: 0.1em;
    color: #fff;
  }

  .head {
    margin-bottom: 30px;
  }

  .headSection {
    margin-bottom: 120px;
  }

  .headerTel {
    padding-left: 10px;
    text-decoration: none;
    color: #fff;
  }

  .headerTel span,
  .headerTel i {
    font-size: 1.6rem;
    font-weight: 700;
  }

  .headerTel i {
    margin-right: 3px;
  }

  .hNav {
    display: none;
  }

  main,
  .container-concept {
    max-width: 900px;
    padding: 0 30px 30px;
    margin: 0 auto;
  }

  /*
    main {
    margin-bottom: 150px;
}
    */

  .mv-sp,
  .head-sp {
    display: none;
  }

  .mv-pc,
  .head-pc {
    display: block;
    width: 100%;
  }

  .top_head:hover {
    cursor: pointer;
  }

  .mv {
    max-width: 900px;
    padding: 5px 24px 0;
    margin: 0 auto;
  }

  .mvArea {
    margin-bottom: 30px;
  }

  .logo {
    right: 50px;
    top: 150px;
    padding: 25px 30px;
  }

  .logo > img {
    display: inline-block;
    width: 200px;
  }

  .logo > p {
    display: block;
    color: #333333;
    font-size: 1.4rem;
    letter-spacing: 0.1em;
  }

  /* ------------グロナビ--------------*/
  nav.mainNav {
    display: block;
    padding: 0 24px;
    max-width: 750px;
    margin: 0 auto 104px;
  }

  .mainNav ul {
    list-style-type: none;
    max-width: 900px;
    margin: 0 auto;
    display: flex;
    justify-content: space-between;
  }

  .mainNav li {
    font-size: 2.2rem;
    font-weight: 700;
    font-family: "Titillium Web", sans-serif;
    letter-spacing: 0.1em;
  }

  .mainNav li a {
    text-decoration: none;
    color: #333;
    display: inline-block;
    position: relative;
    -webkit-transition: all 0.3s ease;
    -moz-transition: all 0.3s ease;
    -o-transition: all 0.3s ease;
    transition: all 0.3s ease;
  }

  .mainNav li a::after {
    position: absolute;
    bottom: -15px;
    left: 50%;
    content: "";
    width: 0;
    height: 3px;
    background-color: #ada69f;
    transition: 0.3s;
    -webkit-transform: translateX(-50%);
    transform: translateX(-50%);
  }

  .mainNav li a:hover::after {
    width: 40px;
  }

  /* -------------Concept------------- */
  .container-concept p {
    text-align: center;
  }

  /* -------------section見出し------------- */
  .mainAc:after {
    top: 25%;
    font-size: 5rem;
  }

  .mainAc:hover::after {
    cursor: pointer;
  }

  .mainAc.open:after {
    top: 25%;
  }

  /* -------------Salon info------------- */
  .container-salonInfo {
    margin-top: 80px;
  }

  .container-salonInfo .main-inner {
    overflow: hidden;
  }

  .salon_flex {
    display: flex;
    flex-direction: row;
    justify-content: space-between;
  }

  .salonMv {
    width: 40%;
  }

  .information {
    width: 55%;
  }

  .telArea {
    margin-top: 48px;
    font-size: 2.5rem;
  }

  .salon_flex2 {
    flex-direction: row;
    justify-content: space-between;
    margin-top: 50px;
  }

  .gMap {
    margin-top: 0;
    width: 65%;
    height: 248px;
  }

  .salon_calender {
    width: 30%;
    margin-top: 0;
  }

  .lead {
    font-size: 1.8rem;
    margin-bottom: 25px;
  }

  /* -------------Campaign------------- */
  /*
    .lead {
    font-size: 1.8rem;
    margin-bottom: 25px;
}

    .campaign-contents {
    overflow: hidden;
}

    .campaignBox {
    float: left;
    width: 35%;
    margin-right: 10px;
}

    .campaignDescription {
    float: right;
    width: 62%;
}
    */

  /* -------------Instagram------------- */
  #instagram .head-pc:hover {
    cursor: initial;
  }

  .head-insta p {
    font-size: 1.8rem;
    top: 20%;
  }

  .instaPhotoArea > div {
    width: 219px;
  }

  .instaPhotoArea > div:not(:nth-child(4n)) {
    margin-right: 8px;
  }

  /* -------------Faq------------- */
  .faq-question {
    font-size: 1.6rem;
  }

  .inner {
    font-size: 1.5rem;
  }

  .spTel {
    display: none;
  }

  /* -------------PC-パララックス------------- */
  .topBg {
    /*        background-image: url("../images/bg-para@2x.png");*/
    background-position: center center;
    background-repeat: no-repeat;
    background-attachment: fixed;
    background-size: cover;
    box-sizing: border-box;
  }

  .topBg {
    height: 700px;
  }

  .topBg::before {
    height: 200px;
    top: -190px;
  }

  .topBg:after {
    height: 200px;
    bottom: -190px;
  }

  /*PC-pageTopボタン*/

  #pageTop a {
    padding: 16px;
    font-size: 2.5rem;
  }

  /*    PC-footer     */
  .footer_area {
    height: auto;
    padding-top: 100px;
    overflow: hidden;
    box-sizing: border-box;
  }

  footer::before {
    top: -80px;
  }

  .footer_container {
    max-width: 900px;
    padding-right: 30px;
    padding-left: 30px;
    margin: 0 auto;
  }

  footer p {
    margin-top: 0;
  }

  /* -------------Topicsページ用751px以上------------- */

  header.headerArea {
    height: 7vw;
  }

  .otherHeader > .h1 {
    font-weight: 300;
    display: inline-block;
  }

  .otherHeader > .pcHeaderText {
    display: inline-block;
    padding-right: 0;
    padding-top: 0;
    font-weight: 400;
  }

  .otherHeader > .headerTel {
    display: inline;
  }

  nav.otherpageHead {
    margin-top: 10px;
  }

  img.pageHead {
    width: 100%;
  }

  .topicsIndex p img {
    max-width: 100%;
  }

  .topicsMain {
    overflow: hidden;
    padding-bottom: 30px;
  }

  .topics-indexArea {
    float: left;
    width: 74%;
    margin-right: 2%;
  }

  .topics_flex {
    display: flex;
    justify-content: space-between;
  }

  .topics-SortArea {
    float: right;
    width: 21%;
  }

  .pager {
    max-width: 900px;
    padding: 30px 30px 0;
    margin: 30px auto 0;
  }

  pager .pagination {
    text-align: center;
  }

  .pager .pagination li {
    display: inline;
    margin: 5px 2px;
    padding: 0;
    display: inline-block;
    background: #333;
    width: 50px;
    height: 50px;
    text-align: center;
    position: relative;
    border-radius: 50px;
  }

  .pager .pagination li a {
    vertical-align: middle;
    position: absolute;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
    text-align: center;
    display: table;
    color: #fff;
    text-decoration: none;
    -webkit-transition: all 0.3s ease;
    -moz-transition: all 0.3s ease;
    -o-transition: all 0.3s ease;
    transition: all 0.3s ease;
  }

  .pager .pagination li.pre,
  .pager .pagination li.next {
    width: 25%;
  }

  .pager .pagination li a span {
    display: table-cell;
    vertical-align: middle;
  }

  .pager .pagination li a:hover,
  .pager .pagination li a.active {
    color: #333;
    background: #fff;
    border: 1px solid #333;
    border-radius: 50px;
  }

  .topics-SortArea {
    margin-top: 0;
  }

  /* ----------------PC用/コンタクトページ---------------- */
  .formArea {
    max-width: 500px;
    margin-right: auto;
    margin-left: auto;
  }

  .formArea input {
    font-size: 100%;
    width: 100%;
  }

  .formArea input[type="reset"],
  .formArea input[type="submit"] {
    width: 150px;
    height: 40px;
  }

  .formArea input[type="reset"]:hover,
  .formArea input[type="submit"]:hover {
    cursor: pointer;
    opacity: 0.7;
  }

  .formArea p {
    margin-top: 30px;
  }

  /* ----------------PC用/SNS追従メニュー---------------- */
  .snsNav {
    display: block;
    position: fixed;
    z-index: 5;
    right: 1%;
    top: 5%;
  }

  .snsNav ul {
    display: flex;
    flex-direction: column;
    list-style-type: none;
  }

  .snsNav li {
    margin-bottom: 5px;
  }

  .snsNav a {
    display: inline-block;
    width: 40px;
    height: 40px;
    border-radius: 50%;
    text-align: center;
    position: relative;
  }

  .snsNav img {
    position: absolute;
    left: 17%;
    width: 25px;
    text-align: center;
    top: 0;
    left: 0;
    right: 0;
    bottom: 0;
    margin: auto;
  }

  /* ----------------PC用/WEB予約ボタン---------------- */
  .reservation a {
    width: 80px;
    height: 80px;
  }

  .reservation span {
    width: 80px;
    font-size: 1.8rem;
  }
}

/* ========= ▲▲▲▲▲for iPhone Landscape　900px以上(for iPad&PC)▲▲▲▲▲ ========= */

@media screen and (min-width: 900px) {
  .logo {
    right: 100px;
    top: 50%;
    transform: translateY(-50%);
  }
}

/* ========= ▲▲▲▲▲for iPhone Landscape　751以上960まで(for iPad&PC)▲▲▲▲▲ ========= */

@media screen and (min-width: 751px) and (max-width: 959px) {
  .instaPhotoArea > div:not(:nth-child(3n)) {
    margin-right: 8px;
  }
}