/*
Theme Name: Apache corporate
Theme URI: http://www.barberapache.com/
Version: 2023.10.21
Author: Element.inc
Author URI: http://elmt.jp/
*/
@charset "utf-8";

/*-----------------------------------
 ブラウザリセット
-----------------------------------*/
html,
body,
div,
span,
applet,
object,
iframe,
h1,
h2,
h3,
h4,
h5,
h6,
p,
blockquote,
pre,
a,
abbr,
acronym,
address,
big,
cite,
code,
del,
dfn,
em,
font,
img,
ins,
kbd,
q,
s,
samp,
small,
strike,
strong,
sub,
sup,
tt,
var,
dl,
dt,
dd,
ol,
ul,
li,
fieldset,
form,
label,
legend,
table,
caption,
tbody,
tfoot,
thead,
tr,
th,
td {
  margin: 0;
  padding: 0;
  border: 0;
}

table,
caption,
th,
td {
  margin: 0;
  padding: 0;
  border: 0;
  border-collapse: collapse;
  border-spacing: 0px;
  empty-cells: show;
  text-align: left;
  font-weight: normal;
}

a img,
iframe {
  border: none;
}

ol,
ul,
li {
  list-style: none;
}

textarea,
select,
button {
  font-size: 100%;
  font-family: inherit;
}

select {
  -webkit-appearance: none;
  -moz-appearance: none;
  -ms-appearance: none;
  appearance: none;
  padding-right: 30px !important;
  background: url("./images/arrow01.png") no-repeat, rgba(255, 255, 255, 1);
  background-position: right;
}

/* ************************************************
Setting

※PCのみの設定→style_pc.css
※SPのみの設定→style_sp.css
************************************************ */

html,
body {
  width: 100%;
  margin: 0;
  padding: 0;
  background: #000;
  color: #fff;
}

html {
  scroll-behavior: smooth;
  scroll-padding-top: 64px;
}

a:hover {
  opacity: 0.7;
  filter: alpha(opacity=70);
  -ms-filter: "alpha(opacity=70)";
}

img {
  max-width: 100%;
}

div {
  display: block;
}

.mb0 {
  margin-bottom: 0 !important;
}

/* clearfix */
.clearfix:after {
  visibility: hidden;
  display: block;
  font-size: 0;
  content: " ";
  clear: both;
  height: 0;
}

/* font */
html,
body {
  font-family: "ヒラギノ角ゴ Pro W3", "Hiragino Kaku Gothic Pro", "メイリオ", Meiryo, Osaka, "ＭＳ Ｐゴシック", "MS PGothic", sans-serif;
}

/* ---------------------------------------
Header Setting
--------------------------------------- */
#header_wrap {
  font-weight: bold;
}

#header {
  margin: 0 auto;
}

#header a {
  text-decoration: none;
  line-height: 12px;
}

#header li {
  text-align: center;
}

/* ---------------------------------------
Main Setting
--------------------------------------- */

/* 共通 */
#one,
#two,
#three,
#four,
#five,
#six,
#seven,
#nine,
#ten {
  background-position: 50% 50%;
  background-repeat: no-repeat !important;
  background-attachment: fixed !important;
}

#four_2 {
  background-position: 50% 0;
  background-repeat: no-repeat !important;
  background-attachment: fixed !important;
}

/*追加*/
#one h2 {
  font-family: "Squada One", cursive;
}

#two .ct_innner {
  text-align: center;
}

#two h2 {
  font-family: "Squada One", cursive;
}

#two h3 {
  font-family: "Squada One", cursive;
}

#three h2,
#four h2,
#five h2,
#six h2,
#seven h2,
#eight h2,
#nine h2,
#ten h2 {
  font-weight: blod;
}

#three h3,
#four h3,
#five h3,
#six h3,
#seven h3,
#eight h3,
#nine h3,
#ten h3 {
  font-weight: blod;
}

div.ct_innner {}

.float_twoct {
  margin: 0 auto;
}

.float_twoct:after {
  content: "";
  display: block;
  float: none;
  clear: both;
  visibility: hidden;
}

.contact_info {
  background: rgba(0, 0, 0, 0.6);
  border-radius: 15px;
  padding: 30px 30px 40px;
  width: 80%;
}

.contact_info p:nth-child(1) {
  font-size: 30px;
}

.contact_info .tel_number {
  font-family: "Squada One", cursive;
  font-size: 50px;
}

.contact_info .tel_number a {
  color: #FFF;
  text-decoration: none;
}

.contact_info .tel_number a:hover {
  opacity: 0.7;
  filter: opacity(70%);
}

.contact_info .tel_number small {
  margin-right: 10px;
  font-size: 22px;
}

.contact_info .contact_info_detail {
  margin-top: 10px;
}

.contact_info .store_link {
  color: #fff;
  text-decoration: underline;
}

.contact_info ul li a {
  color: #fff;
  text-decoration: underline;
}

#ct_barbershop #eight {
  background: rgba(0, 0, 0, 1);
}

.maincontactform input.wpcf7-text,
.maincontactform textarea.wpcf7-textarea {
  display: block;
  width: 100%;
  margin-bottom: 10px;
  font-size: 14px;
  padding: 5px;
}

.maincontactform input.wpcf7-submit {
  clear: both;
}

.blogtextlink a {
  display: inline-block;
  padding: 5px 10px;
  border: solid 2px #a09d9d;
  border-radius: 15px;
  color: #a09d9d;
  text-decoration: none;
}

/* blog rss */
.threect p a {
  display: block;
  background-size: cover !important;
  background-position: center !important;
  background-repeat: no-repeat;
}

.threect span {
  display: block;
  margin: -10px auto 0;
  padding: 5px 10px 10px;
  width: 100%;
  height: 50px;
}

.btitle {
  background: rgba(0, 0, 0, 0.8);
  color: #fff;
  font-size: 15px;
  line-height: 15px;
  font-weight: bold;
  text-align: left;
  position: relative;
  top: 242px;
  z-index: 9999;
}

.btdate {
  display: inline-block;
  font-size: 10px;
  color: #a09d9d;
  font-weight: normal;
}

/* Top Page */
.flexslider {
  width: 100%;
}

.slides {
  width: 100%;
}

#toppage #one {}

#toppage #one ul li img {
  width: 100%;
  max-width: inherit;
  text-align: center !important;
}

#toppage #two {
  background: #000;
}

#toppage #two p:nth-child(2) {
  margin: 0 auto;
}

#toppage #two h3 {
  font-family: "Squada One", cursive;
  font-weight: normal;
}

#toppage #three {
  background: rgba(0, 0, 0, 1);
  display: flex;
  gap: 0 60px;
  width: 100%;
  margin: 100px auto 0;
}

#toppage #three img {
  width: 100%;
  margin: 0;
}

#toppage #four {
  background-image: url("./images/recruit01.jpg");
  background-size: cover;
  background-attachment: fixed !important;
  background-position: 50% 50% !important;
}

#toppage #four p.subtitle {
  display: block;
  margin: 10px 0 0;
  padding: 0;
}

#toppage #four h2 {
  font-family: "Squada One", cursive;
  font-weight: normal;
}

#toppage #four h3 {
  font-family: "Squada One", cursive;
  font-weight: normal;
}

#toppage #four .ct_innner {
  position: relative;
}

#toppage #four .ct_innner a {
  position: absolute;
  top: 0;
  left: 0;
  height: 100%;
  width: 100%;
}

#toppage #four .ct_innner a:hover {
  opacity: 0.1;
}

#toppage #five {
  background-image: url("./images/top03.jpg");
  background-size: cover;
  background-attachment: fixed !important;
  background-position: 50% 50% !important;
}

#toppage #five p.subtitle {
  display: block;
  margin: 10px 0 0;
  padding: 0;
}

#toppage #five h2 {
  font-family: "Squada One", cursive;
  font-weight: normal;
}

#toppage #five h3 {
  font-family: "Squada One", cursive;
  font-weight: normal;
}

#toppage #five img {
  display: block;
  margin: 0 auto;
}

#toppage #five {
  position: relative;
}

#toppage #five a {
  position: absolute;
  top: 0;
  left: 0;
  width: 100%;
  height: 100%;
}

#toppage #five a:hover {
  background: rgba(0, 0, 0, 0.5);
}

/* 20200606追加 */
#toppage ul.slides li {
  position: relative;
  z-index: 1;
}

#toppage ul.slides li a {
  color: #fff;
}

#toppage ul.slides li span {
  position: absolute;
  top: 45vh;
  left: 1em;
  font-size: 100px;
  font-family: "Squada One", cursive;
  text-shadow: 2px 2px 5px rgba(0, 0, 0, 0.6);
  z-index: 99;
}

#toppage ul.slides li span small {
  display: block;
  font-size: 0.35em;
  font-weight: bold;
}

/* Barbershop */
#ct_barbershop #one {
  background: url("./images/barber01.jpg");
}

#ct_barbershop #two {
  background: rgba(0, 0, 0, 1);
}

#ct_barbershop #three {
  background: url("/images/barber02.jpg");
}

#ct_barbershop #four {
  background: rgba(0, 0, 0, 1);
}

#ct_barbershop #five {
  background: url("./images/barber03.jpg");
  background-size: cover;
  backgorund-positon: 50% 50%;
}

#ct_barbershop #six {
  background: rgba(0, 0, 0, 1);
}

#ct_barbershop #seven {
  background: url("./images/barber04.jpg");
}

/* About */
#ct_about #one {
  background: url("./images/about01.jpg");
}

#ct_about #two {
  background: rgba(0, 0, 0, 1);
}

#ct_about #three {
  background: rgba(0, 0, 0, 1);
}

#ct_about #four {
  background: rgba(0, 0, 0, 1);
}

#ct_about #five {
  background: url("./images/about02.jpg");
}

#ct_about #six {
  background: rgba(0, 0, 0, 1);
}

#ct_about .staff {
  margin-bottom: 150px;
}

#ct_about .staff h3 {
  font-family: "Squada One", cursive;
  font-weight: normal;
  text-align: center;
  margin-bottom: 50px;
}

#ct_about .staff h4 {
  font-family: "Squada One", cursive;
}

#ct_about .staff p>a {
  color: #fff;
  text-decoration: underline;
}

#ct_about .staff ul.staff_btlist {
  margin: 0 0 30px;
}

#ct_about .staff ul.staff_btlist li img {
  display: block;
  max-width: 100%;
  margin: 0 auto;
  text-align: center;
}

#ct_about .staff ul.staff_btlist li {
  display: inline-block;
  float: left;
  text-align: center;
  max-width: 31%;
  margin-right: 2%;
}

#ct_about .staff .txtlink {
  display: block;
  margin: 0 auto 2em;
  padding-left: 24px;
  position: relative;
}

#ct_about .staff .txtlink:before {
  position: absolute;
  content: "\f0c1";
  font-family: "Font Awesome 5 Free";
  font-weight: 900;
  top: 1px;
  left: 0;
}

/* Cut/Style */
#ct_cutstyle #one {
  background: url("./images/cut01.jpg");
}

#ct_cutstyle #two {
  background: rgba(0, 0, 0, 1);
}

#ct_cutstyle #three {
  background: rgba(0, 0, 0, 1);
}

/* Coumetrue */
#ct_cometrue #one {
  background: url("./images/cometrue01.jpg");
}

#ct_cometrue #two {
  background: rgba(0, 0, 0, 1);
}

#ct_cometrue #three {
  background: url("./images/cometrue02.jpg");
  background-size: cover;
}

#ct_cometrue #two h3 {
  font-family: "Squada One", cursive;
}

#ct_cometrue #two h3 span {
  font-family: "ＭＳ Ｐ明朝", "MS PMincho", "ヒラギノ明朝 Pro W3", "Hiragino Mincho Pro", serif;
  font-weight: normal;
  font-size: 30px;
}

/* Journey */
#journey #one {
  background: url("./images/journey01.jpg");
}

#journey #two {
  background: rgba(0, 0, 0, 1);
}

#journey #three {
  background: rgba(0, 0, 0, 1);
}

/* Friends */
#friends #one {
  background: url("./images/friends01.jpg");
}

#friends #two {
  background: rgba(0, 0, 0, 1);
}

#friends #three {
  background: rgba(0, 0, 0, 1);
}

/* Recruit */
#ct_recruit #one {
  background-image: url("./images/recruit01.jpg");
}

#ct_recruit #two {
  background: rgba(0, 0, 0, 1);
}

#ct_recruit #three {
  background-image: url("./images/recruit02.jpg");
  background-size: cover;
}

#ct_recruit #four {
  background: rgba(0, 0, 0, 1);
}

#ct_recruit #five {
  background: rgba(0, 0, 0, 1);
}

#ct_recruit #six {
  background-image: url("./images/recruit03.jpg");
  background-size: cover;
}

#ct_recruit #seven {
  background: rgba(0, 0, 0, 1);
}

.youtube_mov iframe {
  width: 100%;
  height: 560px;
}

.youtube_mov p.youtube_mov_text {
  margin-bottom: 2em;
  text-align: center;
}

.youtube_mov p.youtube_mov_text a {
  color: #fff;
  text-decoration: none;
}

#ct_recruit .youtube_mov h3 {
  font-family: "Squada One", cursive;
  font-weight: normal;
  text-align: center;
  margin-bottom: 50px;
}

#ct_recruit #six h3,
#ct_recruit #seven h3 {
  margin-bottom: 1em;
}

/* Recruit-2 */
#recruitFV #one {
  height: 700px;
  margin-bottom: 32px;
  /* background-image: url("./images/recruit/recruit_fv.jpg"); */
  background-image: url("./images/recruit/recruit_fv_2.jpg");
  background-size: cover;
}

@media only screen and (max-width: 600px) {
  #recruitFV #one {
    height: 250px;
    background-position: 50% left 24.5% !important;
  }
}

.recruit__ttl {
  position: relative;
  margin-bottom: 64px;
  padding-bottom: 10px;
  border-bottom: 1px solid #fff;
}

.recruit__ttl--spell {
  display: block;
  position: absolute;
  bottom: 10px;
  left: 8px;
  font-size: 24px;
  font-family: "Tangerine", cursive;
  transform: rotate(-12deg);
}

.recruit__ttl--txt {
  color: #fff;
  font-size: 24px;
  text-align: right;
}

.recruit__ttl.pt2 {
  height: 38px;
}

.recruit__ttl.pt2 .recruit__ttl--spell {
  bottom: 20px;
}

.recruit__hl2 {
  margin-bottom: 32px;
  font-size: 24px;
}

.recruitPrologue {
  width: 100%;
  max-width: 520px;
  margin: 128px auto 64px auto;
}

.recruitPrologue__hl2 {
  text-align: center;
}

.recruitPrologue p {
  margin-bottom: 32px;
  text-align: center;
}

@media only screen and (max-width: 600px) {
  .recruitPrologue {
    margin-top: 96px;
    padding: 0 1rem;
    box-sizing: border-box;
  }
}

.recruit__entry {
  width: 100%;
  margin: 0 0 64px 0;
}

.recruit__entry--btn {
  display: block;
  width: 100%;
  margin: 0 0 64px 0;
  padding: 1rem 0;
  box-shadow: 0px 3px 6px #000;
  background-color: #fff;
  color: #4b4848;
  font-size: 24px;
  font-weight: bold;
  text-align: center;
  text-decoration: none;
  transition: all 0.3s ease-in-out;
}

.recruit__entry--btn:hover {
  opacity: 0.85;
}

.recruit__link {}

.recruit__link--txt {
  position: relative;
  color: #a09d9d;
}

.recruit__link--txt:after {
  content: "";
  position: absolute;
  right: -20px;
  top: 0;
  width: 16px;
  height: 16px;
  background: url(./images/recruit/icon_link.png) no-repeat;
  background-size: contain;
  transition: all 0.3s ease-in-out;
}

.recruit__photo {
  width: 100%;
  height: 400px;
  margin: 0;
  background-position: center;
  background-repeat: no-repeat;
  background-size: cover;
}

.recruit__photo.recruit-img1 {
  background-image: url(images/recruit/recruit_img_01.jpg);
}

.recruit__photo.recruit-img2 {
  background-image: url(images/recruit/recruit_img_02.jpg);
}

@media only screen and (max-width: 600px) {
  .recruit__photo {
    height: 200px;
  }
}

.recruitChannel {
  width: 100%;
  margin: 0;
}

.recruitChannel__inner {
  width: 100%;
  max-width: 1024px;
  margin: 0 auto;
  padding: 128px 0;
}

.recruitChannel p {
  margin-bottom: 128px;
}

.recruitChannel .last-para {
  margin-bottom: 64px;
}

.recruitChannel .recruit__link {
  text-align: right;
}

@media only screen and (max-width: 600px) {
  .recruitChannel__inner {
    padding: 96px 1rem;
    box-sizing: border-box;
  }

  .recruitChannel p {
    margin-bottom: 64px;
  }

  .recruitChannel .recruit__link {
    text-align: center;
  }
}

.recruitFlow {
  width: 100%;
  background-color: #4b4848;
}

.recruitFlow__inner {
  width: 100%;
  max-width: 520px;
  margin: 0 auto;
  padding: 128px 0;
}

.recruitFlow .recruitFlow__list {
  width: 100%;
  max-width: 320px;
  margin: 0 auto 64px auto;
}

.recruitFlow .recruitFlow__listItem {
  width: 100%;
  margin-bottom: 10px;
  padding: 1rem 1.5rem;
  border-radius: 8px;
  background: #000;
  color: #fff;
  box-sizing: border-box;
}

.recruitFlow .recruitFlow__next {
  width: 0;
  height: 0;
  border-style: solid;
  border-width: 15px 6px 0 6px;
  border-color: #000000 transparent transparent transparent;
}

.recruitFlow .recruit__link {
  color: #a09d9d;
  text-align: center;
}

@media only screen and (max-width: 600px) {
  .recruitFlow__inner {
    padding: 96px 1rem;
    box-sizing: border-box;
  }
}

.recruitShop {
  width: 100%;
  background-color: #4b4848;
}

.recruitShop__inner {
  width: 100%;
  max-width: 520px;
  margin: 0 auto;
  padding: 128px 0;
}

.recruitShop .recruitShop__list {
  width: 100%;
  margin: 0 auto;
}

.recruitShop .recruitShop__listItem {
  width: 100%;
  margin-bottom: 128px;
}

.recruitShop .recruitShop__listItem:last-child {
  margin-bottom: 64px;
}

.recruitShop .recruitShop__listItem img {
  width: 100%;
  height: auto;
  object-fit: contain;
  margin-bottom: 48px;
}

.recruitShop .recruitShop__listItem h3 {
  margin-bottom: 16px;
  font-size: 24px;
}

.recruitShop .recruitShop__listItem--info {
  display: flex;
  justify-content: flex-start;
  align-items: center;
  flex-wrap: nowrap;
  margin-bottom: 16px;
}

.recruitShop .recruitShop__listItem--info dt {
  padding: 8px 16px;
  background-color: #000;
  color: #fff;
  font-size: 10px;
}

.recruitShop .recruitShop__listItem--info dd {
  margin-left: 8px;
  color: #fff;
}

.recruitShop .recruitShop__listItem--line {
  width: 100%;
  border: none;
  border-top: 1px solid #fff;
}

.recruitShop .recruit__link {
  color: #a09d9d;
  text-align: center;
}

@media only screen and (max-width: 600px) {
  .recruitShop__inner {
    padding: 96px 1rem;
    box-sizing: border-box;
  }

  .recruitShop .recruitShop__listItem {
    margin-bottom: 64px;
  }
}

.recruitVoice {
  width: 100%;
}

.recruitVoice__inner {
  width: 100%;
  max-width: 520px;
  margin: 0 auto;
  padding: 128px 0;
}

.recruitVoice .recruitVoice__list {
  width: 100%;
  margin: 0 auto;
}

.recruitVoice .recruitVoice__list a {
  display: block;
  color: #fff;
  text-decoration: none;
}

.recruitVoice .recruitVoice__listItem {
  display: grid;
  grid-template-columns: 1fr 1fr;
  grid-template-rows: 1fr;
  gap: 0 48px;
  width: 100%;
  margin-bottom: 64px;
  padding: 24px;
  box-sizing: border-box;
  background-color: #4b4848;
}

.recruitVoice .recruitVoice__listItem--thumb {
  width: 212px;
}

.recruitVoice .recruitVoice__listItem--thumb img {
  width: 100%;
  height: auto;
  object-fit: contain;
  margin: 0;
}

.recruitVoice .recruitVoice__listItem--txt {
  width: 212px;
}

.recruitVoice .recruitVoice__listItem--txt h3 {
  margin-bottom: 24px;
  font-size: 16px;
}

.recruitVoice .recruitVoice__listItem--txt p {
  font-size: 12px;
  text-align: right;
}

.recruitVoice .recruit__link {
  margin-bottom: 64px;
  color: #a09d9d;
  text-align: center;
}

.recruitVoice .recruitBanner__list {
  width: 100%;
  margin: 0;
}

.recruitVoice .recruitBanner__list a {
  display: block;
  text-decoration: none;
  transition: all 0.3s ease-in-out;
}

.recruitVoice .recruitBanner__list img {
  width: 100%;
  height: auto;
  object-fit: contain;
}

@media only screen and (max-width: 600px) {
  .recruitVoice__inner {
    padding: 96px 1rem;
    box-sizing: border-box;
  }

  .recruitVoice .recruitVoice__listItem {
    display: grid;
    grid-template-columns: 1fr;
    grid-template-rows: 1fr 1fr;
    gap: 48px 0;
    width: 100%;
    max-width: 260px;
    margin: 0 auto 64px auto;
  }

  .recruitVoice .recruitVoice__listItem--thumb img {
    width: 100%;
    height: auto;
    object-fit: contain;
    margin: 0;
  }
}

.recruitEntry {
  width: 100%;
}

.recruitEntry__inner {
  width: 100%;
  max-width: 520px;
  margin: 0 auto;
  padding: 0 0 128px 0;
}

.recruitEntry .recruit__hl2 {
  text-align: center;
}

@media only screen and (max-width: 600px) {
  .recruitEntry__inner {
    padding: 0 1rem 96px 1rem;
    box-sizing: border-box;
  }
}

.recruitConfirm {
  width: 100%;
}

.recruitConfirm__inner {
  width: 100%;
  max-width: 520px;
  margin: 0 auto;
  padding: 128px 0;
}

.recruitConfirm .recruitConfirm__txt p {
  margin-bottom: 32px;
}

.recruitConfirm .mw_wp__container .mw_wp__item dt {
  font-weight: bold;
}

.recruitConfirm .mw_wp__container .mw_wp__item dt::after {
  content: " :";
}

.recruitConfirm .mw_wp__container .mw_wp__item dt span {
  display: none;
}

.recruitComplete {
  width: 100%;
}

.recruitComplete__inner {
  width: 100%;
  max-width: 520px;
  margin: 0 auto;
  padding: 128px 0;
}

.recruitComplete .recruitComplete__txt p {
  margin-bottom: 32px;
}

.recruitComplete .recruit__link {
  text-align: center;
}

.mw_wp__container {}

.mw_wp__container .mw_wp__item {
  width: 100%;
  margin: 0 0 32px 0;
}

.mw_wp__container .mw_wp__item dt {
  margin-bottom: 8px;
  color: #fff;
}

.mw_wp__container .mw_wp__item dt span {
  margin-left: 1rem;
  padding: 4px 6px;
  background-color: #ff7f00;
  font-size: 10px;
  vertical-align: 2px;
}

.mw_wp__container .mw_wp__item input[type="text"],
.mw_wp__container .mw_wp__item input[type="email"],
.mw_wp__container .mw_wp__item textarea {
  width: 100%;
  padding: 1rem;
  border: 1px solid #ddd;
  border-radius: 5px;
  background-color: #fff;
  font-size: 1rem;
  box-sizing: border-box;
}

.mw_wp_form .mw_wp__container .mw_wp__item .error {
  margin-top: 5px;
}

.mw_wp__container .mw_wp__action {
  margin: 64px 0 0 0;
}

.mw_wp__container .mw_wp__action .submit__btn {
  display: block;
  width: 100%;
  max-width: 290px;
  margin: 0 auto;
  padding: 1rem 0;
  border: none;
  border-radius: 4px;
  background-color: #ff7f00;
  color: #000;
  font-size: 16px;
  font-weight: bold;
  text-align: center;
  text-decoration: none;
  transition: all 0.3s ease-in-out;
}

.mw_wp__container .mw_wp__action .submit__btn:hover {
  opacity: 0.85;
}

.youtube {
  width: 100%;
  margin-bottom: 32px;
  aspect-ratio: 16 / 9;
}

.youtube iframe {
  width: 100%;
  height: 100%;
}

/* ---------------------------------------
Footer Setting
--------------------------------------- */
#footer_wrap {
  background: #000;
  font-size: 10px;
  text-align: center;
  margin: 0 auto;
  padding: 20px 0;
  letter-spacing: 0.5px;
}

/* ---------------------------------------
2020.09.28追加
--------------------------------------- */

ul.child_list {
  display: flex;
  flex-wrap: wrap;
  align-items: center;
  margin: 1em 0;
}

ul.child_list li {
  margin: 0 0.5em 0.5em 0;
}

.child_list a {
  display: block;
  color: #ffffff;
  text-decoration: none;
  border: solid 1px #ffffff;
  padding: 5px 1em;
  border-radius: 5px;
}

p.one_subtext {
  margin: 20px 0;
}

/* ---------------------------------------
2020.10.31追加
--------------------------------------- */
#topcat_1 {
  background: rgba(90, 90, 30, 1);
}

#topcat_2 {
  background: rgba(100, 40, 40, 1);
}

.topblog_quote h2 {
  font-family: "Squada One", cursive;
  font-size: 60px;
  font-weight: normal;
  margin-top: 10px;
}

ul.child_list,
ul.child_list * {
  box-sizing: border-box;
}

ul.child_list {
  display: flex;
  flex-wrap: wrap;
  align-items: center;
  margin: 1em 0;
}

ul.child_list li {
  margin: 0 0.5em 0.5em 0;
  padding: 0;
}

.child_list a {
  display: block;
  color: #fff;
  text-decoration: none;
  border: solid 1px #fff;
  padding: 5px 1em;
  border-radius: 5px;
}

@media (max-width: 480px) {
  .topblog_quote h2 {
    font-size: 30px;
  }

  .topblog_quote .child_list a {
    font-size: 80%;
  }
}

/* ---------------------------------------
2020.11.20topgoods追加
--------------------------------------- */
#toppage #topgoodsctbx {
  width: 100%;
  background: #000;
  display: flex;
  flex-wrap: wrap;
}

#toppage .tpgdctbx {
  width: 34%;
  padding: 100px 8%;
}

#toppage .tpgdctbg01 {
  background: url(./images/aps_goodsbg01.jpg);
  background-size: cover;
  background-position: center;
}

#toppage .tpgdctbg02 {
  background: url(./images/aps_goodsbg02.jpg);
  background-size: cover;
  background-position: center;
}

/* 2023.11.15 topgoods 2つ追加 */
#toppage .tpgdctbg03 {
  background: url(./images/aps_goodsbg03.jpg);
  background-size: cover;
  background-position: center;
}

#toppage .tpgdctbg04 {
  background: url(./images/aps_goodsbg04.jpg);
  background-size: cover;
  background-position: center;
}



#toppage #topgoodsctbx ul.tpgdti {
  width: 100%;
  font-size: 48px;
  font-family: "Squada One", cursive;
  margin-bottom: 20px;
}

#toppage #topgoodsctbx ul.tpgdti li a {
  color: #fff;
}

#toppage #topgoodsctbx ul.tpgdti span {
  font-size: 14px;
  margin-left: 10px;
}

#toppage #topgoodsctbx ul.tpgdct {
  width: 100%;
  display: flex;
  flex-wrap: wrap;
}

#toppage #topgoodsctbx ul.tpgdct li {
  margin: 0 0.5em 1.5em 0;
}

#toppage #topgoodsctbx ul.tpgdct li a {
  color: #fff;
  font-size: 14px;
  border: 1px solid #fff;
  padding: 5px 1em;
  border-radius: 5px;
  text-decoration: none;
}

#toppage #topgoodsctbx ul.tpgdct li p {
  font-family: "Squada One", cursive;
}


#toppage,
tpgdctbx p {
  width: 100%;
  margin-bottom: 15px;
  font-size: 14px;
}

/* ---------------------------------------
2021.1.16top予約追加
--------------------------------------- */
.topbooking {
  width: 100%;
  background: #000000;
  color: #ffffff;
}

.topbookingin {
  width: 90%;
  padding: 5%;
  border: 1px solid #ffffff;
  text-align: center;
}

.topbookingin h2 {
  font-family: "Squada One", cursive;
  font-size: 45px;
  margin-bottom: 1.5rem;
}

.topbookingin dt {
  font-size: 30px;
  letter-spacing: 0.1em;
  font-family: "Squada One", cursive;
  margin: 10px 0;
}

.topbookingin dt span {
  font-size: 14px;
  margin-right: 5px;
}

.topbookingin dt a {
  color: #ffffff;
}

.topbookingin dd {
  line-height: 30px;
}

.topbookingin dd a {
  color: #ffffff;
}

/* ---------------------------------------
2021.1.16 トップスライダー調整
--------------------------------------- */
.flexslider {
  box-sizing: border-box;
  width: 100%;
  overflow: hidden;
}

/* ---------------------------------------
2021.3 twofacebalm
--------------------------------------- */
.twofacebx {
  width: 100%;
  background: #000000;
  color: #fff;
}

.towfacehdline {
  width: 100%;
  height: 60px;
  background: url(./images/twoface_borderbg.png);
}

.towface01 {
  width: 100%;
  background: url(./images/twoface_bigbg.png);
  background-repeat: no-repeat;
  background-position: top left;
}

.towfacebigti {
  width: 1000px;
  margin: 0 auto;
}

.towfacebigti dl {
  width: 100%;
}

.towfacebigti dt {
  width: 200px;
  padding: 120px 0 30px;
  margin: auto;
}

.towfacebigti dt img {
  width: 100%;
}

.towfacebigti dd {
  width: 520px;
  margin: 30px auto;
}

.towfacebigti dd img {
  width: 100%;
}

.towfacebigti ul {
  width: 100%;
  text-align: center;
  font-size: 16px;
  line-height: 32px;
  letter-spacing: 0.1em;
  margin: 80px 0;
}

.towfaceyoutube {
  width: 819px;
  margin: auto;
}

.towfaceyoutube iframe {
  width: 100%;
  height: 420px;
}

.towface01 p {
  width: 100%;
  text-align: center;
  font-size: 16px;
  line-height: 32px;
  padding: 40px 0 100px 0;
  letter-spacing: 0.1em;
}

.towface02 {
  width: 100%;
  background: url(./images/twoface_borderbg.png);
  padding: 120px 0;
}

.towfaceapsti {
  width: 100%;
}

.towfaceapsti dl {
  width: 100%;
}

.towfaceapsti dt {
  width: 60px;
  margin: auto;
}

.towfaceapsti dt img {
  width: 100%;
}

.towfaceapsti dd {
  width: 100%;
  display: flex;
  font-size: 28px;
  margin: 30px auto;
  align-items: center;
  justify-content: center;
}

.towfaceapsti dd::before,
.towfaceapsti dd::after {
  content: "";
  background: #ffffff;
  height: 2px;
  width: 50px;
}

.towfaceapsti dd::before {
  margin-right: 1rem;
}

.towfaceapsti dd::after {
  margin-left: 1rem;
}

.towfaceonoffti {
  width: 100%;
  text-align: center;
}

.towfaceonoffti dl {
  width: 100%;
}

.towfaceonoffti dt {
  font-size: 25px;
  letter-spacing: 0.1em;
  margin-bottom: 30px;
}

.towfaceonoffti dd {
  font-size: 18px;
  line-height: 32px;
}

.towfaceprdctbx {
  width: 1000px;
  margin: auto;
  display: flex;
  padding: 60px 0 100px;
}

.towfacepr {
  width: 45%;
  margin: 0 2.5%;
}

.towfacepr img {
  width: 80%;
  margin: 0 10%;
}

.towfacepr dl {
  width: 100%;
  margin: 30px 0;
  text-align: center;
}

.towfacepr dt {
  font-size: 30px;
  letter-spacing: 0.2em;
}

.towfacepr dd {
  width: 100%;
  font-size: 20px;
}

.towfacepr dd span {
  font-size: 14px;
}

.towfacepr ul {
  width: 100%;
  text-align: center;
}

.towfacepr li {
  font-size: 16px;
}

.towface03 {
  padding: 120px 0;
}

.towfaceuse {
  width: 1000px;
  margin: 100px auto 100px;
  display: flex;
}

.towfaceuseimg {
  width: 100%;
  margin: 0 60px 0 40px;
}

.towfaceuseimg img {
  width: 100%;
}

.towfaceusetxt {
  font-size: 16px;
}

.towfaceusetxt dl {
  margin-bottom: 60px;
}

.towfaceusetxt dt {
  width: 100%;
  text-align: left;
  border-bottom: 1px solid #fff;
  padding-bottom: 10px;
  margin-bottom: 10px;
}

.towfaceusetxt dd {
  line-height: 32px;
  text-align: justify;
}

.towfaceyoutube img {
  vertical-align: bottom;
  width: 70%;
}

.towfaceyoutube p {
  text-align: right;
  font-size: 16px;
  margin-top: 30px;
}

.towface04 {
  width: 100%;
  border-top: 3px solid #fff;
  padding: 120px 0 0;
}

.towface05 {
  width: 1000px;
  margin: 100px auto;
  background: #000000;
  display: flex;
  flex-wrap: wrap;
}

.towfaceftrleft {
  width: 50%;
  margin-right: 5%;
}

.towfaceftrlogo {
  width: 100%;
}

.towfaceftrlogo dl {
  width: 100%;
}

.ttowfaceftrlogo dt {
  width: 100%;
}

.towfaceftrlogo dt img {
  width: 100%;
}

.towfaceftrlogo dd {
  font-size: 16px;
  line-height: 32px;
  margin: 40px 0;
}

.towfacetel {
  width: 100%;
}

.towfacetel dl {
  display: flex;
  letter-spacing: 0.2em;
  margin-bottom: 30px;
}

.towfacetel dt {
  font-size: 18px;
  line-height: 30px;
  margin-right: 2%;
}

.towfacetel dd {
  font-size: 30px;
  line-height: 30px;
}

.towfacetel ul {
  font-size: 18px;
  line-height: 30px;
}

.towfaceftrright {
  width: 45%;
}

.towfaceapsftlogo {
  margin-top: 60px;
}

.towfaceapsftlogo dl {
  width: 100%;
  display: flex;
}

.towfaceapsftlogo dt {
  width: 15%;
  margin-right: 5%;
}

.towfaceapsftlogo dd {
  font-size: 30px;
  letter-spacing: 0.1em;
  line-height: 100px;
}

.towfaceapsftlogo dt img {
  width: 100%;
}

.towfaceftrright {
  width: 45%;
}

.towfaceftrright img {
  width: 100%;
}

.toptowfacebnr {
  width: 90%;
  margin: 0 auto 80px;
}

.toptowfacebnr img {
  width: 100%;
}

/* --------------------------------
 *  210808販売開始 two face balm lp
 * -------------------------------- */
.towface_sale {
  width: 100%;
  background: url(./images/twoface_borderbg.png);
  padding: 120px 0;
}

.towface03 {
  background: url(./images/twoface_borderbg.png);
}

a.btn_twoface {
  display: inline-block;
  color: rgba(255, 255, 255, 0.8);
  text-decoration: none;
  text-shadow: -1px -1px 1px rgba(255, 255, 255, 0.44), 1px 1px 1px #000;
  max-width: 100%;
}

a.btn_twoface:hover {
  opacity: 1;
}

a.btn_twoface {
  position: relative;
  z-index: 2;
  border-radius: 8px;
  overflow: hidden;
}

a.btn_twoface span {
  display: block;
  box-sizing: border-box;
  padding: 1em 2em;
  width: 100%;
  height: 100%;
  transition: 0.5s all;
  box-shadow: 0 0 1px 3px rgba(255, 255, 255, 0.2) inset;
}

a.btn_twoface:hover span {
  box-shadow: 5px 5px 8px 5px rgba(0, 0, 0, 0.3) inset;
}

a.btn_twoface::before,
a.btn_twoface::after {
  content: "";
  display: block;
  width: 100%;
  height: 100%;
  position: absolute;
  top: 0;
  left: 0;
  transition: 0.5s all;
}

a.btn_twoface::before {
  background: linear-gradient(-135deg, #a08252, #684b13);
  z-index: -1;
}

a.btn_twoface::after {
  background: linear-gradient(-135deg, #3f353e, #97979a);
  z-index: -1;
  opacity: 0;
  animation-name: btn_gradient;
  animation-duration: 2.5s;
  animation-timing-function: ease-in;
  animation-delay: 0;
  animation-direction: alternate;
  animation-iteration-count: infinite;
}

@keyframes btn_gradient {
  0% {
    opacity: 0;
  }

  10% {
    opacity: 0;
  }

  90% {
    opacity: 1;
  }

  100% {
    opacity: 1;
  }
}

/* --------------------------------
 *  20221017　contactホットペッパーcolor白　hoverグレーに変更
 * -------------------------------- */
.hotpepper {
  color: #fff;
}

.hotpepper:hover {
  opacity: 0.5;
}

/* --------------------------------
 *  20240627 wholesaleバナーを追加
 * -------------------------------- */
.topwholesale_bnr {
  width: 100%;
  margin: 0 auto;
}

.topwholesale_bnr img {
  width: 100%;
  height: auto;
  object-fit: contain;
}


/* --------------------------------
 *  20250201 about staff追加
 * -------------------------------- */
#ct_about .staff .float_twoct div.floatright dl {
  margin-top: 1em;
}

#ct_about .staff .float_twoct div.floatright a {
  color: #fff;
}

#ct_about .staff .float_twoct div.floatright ul {
  margin-left: 1.5em;
}

#ct_about .staff .float_twoct div.floatright ul li {
  list-style: disc;
}