@charset "UTF-8";

/*
Template: twentytwentyfour
Theme Name: yukiosakiofficial
Theme URI:
Description:
Author:
Version:1.0
*/ 

/* common
--------------------------------*/
img {
  border: none;
  vertical-align: middle;
}

/* レスポンシブ
--------------------------------*/
/* PCサイズでは非表示 */
@media (min-width: 782px) {
  body .my-responsive-smp {
    display: none;
  }
}
/* スマホサイズでは非表示 */
@media (max-width: 781px) {
  body .my-responsive-pc {
    display: none;
  }
}


/* ナビ位置調整 PC時　*/
@media (min-width: 600px) {
/*	
  .wp-block-navigation.items-justified-space-between {
    --navigation-layout-justification-setting: flex-end;
    --navigation-layout-justify: flex-end;
  }
  .items-justified-space-between {
    justify-content: flex-end;
  }
*/
  .wp-block-navigation > li > a {
    font-size: 1.4rem;
  }
  .my-nav-bar > .wp-block-navigation.items-justified-space-between {
    gap: var(--wp--preset--spacing--20);
  }
}

/* ヘッダーフッターナビゲーション */
@media (max-width: 599px) {
/*
  body .wp-site-blocks header .my-header-bar {
    width: 100%;
    position: fixed;
    top: 0;
    z-index: 100;
  }
  body .wp-site-blocks header {
    padding-top: 5.5em;
  }
*/
  body .wp-site-blocks {
    padding-bottom: 6.4em;
  }
  body .wp-site-blocks footer {
    width: 100%;
    position: fixed;
    bottom: 0;
    z-index: 100;
  }
}


/* PCサイズ時 */
@media (min-width: 782px) {
}

/* スマホサイズ時 */
@media (max-width: 781px) {
  /* ボタン表示修正 */
  body .my-responsive-buttons {
    justify-content: center !important;
  }
  body .my-responsive-buttons >.wp-block-button {
    width: 100% !important;
  }
}

/* ヘッダー修正
--------------------------------*/
@media (min-width: 2000px) {
    body .wp-site-blocks header .wp-block-cover {
    min-height: 800px !important;
  }
}

@media (max-width: 1000px) {
  body .wp-site-blocks header .wp-block-cover {
    min-height: 400px !important;
  }
}

/* フッター修正
--------------------------------*/
body .wp-site-blocks footer .my-footNav .wp-block-image img {
  width: auto;
  height: 2rem;
}
body .wp-site-blocks footer .my-footNav .wp-block-image a:hover img {
   transform: scale(1.1)
}

/* スマホサイズ時 */
@media (max-width: 781px) {
  body .wp-site-blocks footer .my-copyright {
    display: block;
    text-align: center;
  }
  body .wp-site-blocks footer .my-copyright .is-layout-flex {
    align-items: center;
  }
  body .wp-site-blocks footer .wp-block-social-links.has-large-icon-size {
    font-size: 1.5rem;
  }
  body .wp-site-blocks footer .my-footNav .wp-block-image img {
    height: 1.5rem;
  }
}


/* タイトル修正
--------------------------------*/
body.archive h1.wp-block-query-title:after,
body.page h1.wp-block-post-title:after {
  display: block;
  width: 12em;
  padding: 0.2em 0;
  margin: 0 auto;
  text-align: center;
  vertical-align: middle;
  font-size: var(--wp--preset--font-size--small);
  color: var(--wp--preset--color--contrast);
  border: 1px solid #fff;
}

/* page */
body.page-information h1.wp-block-post-title:after {
  content: "インフォメーション";
}
body.page-profile h1.wp-block-post-title:after {
  content: "プロフィール";
}
body.page-gallery h1.wp-block-post-title:after {
  content: "ギャラリー";
}
body.page-discography h1.wp-block-post-title:after {
  content: "ディスコグラフィー";
}
body.page-contact-confirm h1.wp-block-post-title:after,
body.page-contact h1.wp-block-post-title:after {
  content: "お問合わせ";
}
body.page-membership h1.wp-block-post-title:after {
  content: "会員限定";
}
body.page-photo-session-confirm h1.wp-block-post-title:after,
body.page-photo-session h1.wp-block-post-title:after {
  content: "個人撮影申込み";
}
body.page-secret-gallery h1.wp-block-post-title:after {
  content: "会員限定ギャラリー";
}
body.page-contribution-confirm h1.wp-block-post-title:after,
body.page-contribution h1.wp-block-post-title:after {
  content: "撮影画像投稿フォーム";
}

/*
body.page-login h1.wp-block-post-title:after {
  content: "ログイン";
}
body.page-sign-up h1.wp-block-post-title:after {
  content: "新規登録";
}
body.page-user-profile h1.wp-block-post-title:after {
  content: "登録情報変更";
}
*/

/* archive */
body.tag-membership h1.wp-block-query-title:after {
  content: "会員限定";
}
body.category-secret-topic h1.wp-block-query-title:after {
  content: "会員限定お知らせ";
}


/* プロフィールコンテンツ修正
--------------------------------*/
@media (max-width: 781px) {
  .my-profile .wp-block-column {
    padding-left: unset !important;
    border-left: none !important;
  }
}


/* table
--------------------------------*/
:is(.is-style-table-type1, .is-style-table-type2) :is(th,td) {
    display: table-cell;
}
@media (max-width: 781px) {
  :is(.is-style-table-type1, .is-style-table-type2) :is(th,td) {
  display: block;
  }
  :is(.is-style-table-type1, .is-style-table-type2) :is(th,td) {
    border: none !important;
  }
}

/* table [stripes] style fix */
.wp-block-table.is-style-stripes {
  border: none;
}


/* フォーム
--------------------------------*/
input[readonly=readonly] {
  font-weight: bold;
  border: none;
  background-color: transparent;
}

select,
textarea,
input[type=date],
input[type=url],
input[type=email],
input[type=tel],
input[type=text],
input[type=password] {
  width: 100%;
  padding: 0.5em;
  font-size: 100%;
  font-family: var(--wp--preset--font-family--body)
  line-height: 1.6;
  color: #444;
  box-sizing: border-box;
  border: 1px solid #eee;
  background-color: #fff;
  box-sizing: border-box;
  border-radius: 0.1em;
}
input[type=date] { width: auto; }

select:focus,
textarea:focus,
input[type=date]:focus,
input[type=url]:focus,
input[type=email]:focus,
input[type=tel]:focus,
input[type=text]:focus,
input[type=password]:focus {
  border: 1px solid #eee;
  box-shadow: 3px 3px 3px rgba(0,0,0,0.4) inset;
}

option {
  padding: 0 0.3em;
}

textarea[id^="re-q"] {
  height: 2.6em;
}

.wpcf7-list-item {
  margin: 0;
}

::placeholder {
  color: #ccc
}

.wpcf7 p {
  margin: 0 0 0.2em;
}

.wpcf7 p.lead {
  margin: 2em 0;
}

.wpcf7 p.ttl {
  margin-top: 1em;
  font-size: 90%;
}

.wpcf7 fieldset {
  margin-top: 1em;
}

.wpcf7 legend {
  font-size: 90%;
}

.wpcf7 legend:before,
p.ttl label:before {
  content: '';
  display: inline-block;
  width: 0;
  height: 0;
  border: 0.4em solid transparent;
  border-left: 0.7em solid #fff;
}

small.ads,
p.ttl label small {
  padding: 0 0.3em;
  margin-left: 0.5em;
  font-weight: normal;
  font-size: 75%;
  vertical-align: 0.1em;
  color: #244e8a;
  background-color: #f9c;
  border-radius: 0.1em;
}

.wpcf7-not-valid-tip {
  color: #f9c;
}

.wpcf7 form.invalid .wpcf7-response-output, .wpcf7 form.unaccepted .wpcf7-response-output, .wpcf7 form.payment-required .wpcf7-response-output {
    border-color: #f9c;
}


/* form-submit-box */
.form-submit-box {
  margin-top: 1em;
  text-align: center;
}

@media (min-width: 782px) {
  .form-submit-box.flex p {
    display: flex;
    justify-content: space-around;
    align-items: center;
  }
  .form-submit-box p input[type=button],
  .form-submit-box p input[type=submit] {
    width: 60%;
  }
  .form-submit-box p input.previous-btn {
    width: 30%;
  }
}

/* form button */
button.wpcf7-form-control,
.form-submit-box input[type=button],
.form-submit-box input[type=submit] {
  display: block;
  width: 100%;
  padding: 0.8rem 0.4rem;
  margin: 0 auto;
  font-size: var(--wp--preset--font-size--medium);
  font-weight: 500;
  font-style: normal;
  color: var(--wp--preset--color--contrast);
  background-color: transparent;
  border: 2px solid var(--wp--preset--color--contrast);
  border-radius: 1em;
  text-decoration: none;
}

button.wpcf7-form-control:hover,
.form-submit-box input[type=button]:hover,
.form-submit-box input[type=submit]:hover {
  color: var(--wp--preset--color--base);
  background-color: var(--wp--preset--color--contrast-3);
  border-color: var(--wp--preset--color--contrast-3);
}

button.wpcf7cp-cfm-edit-btn,
.form-submit-box input.previous-btn {
  color: var(--wp--preset--color--contrast);
  background-color: transparent;
  border: 2px solid var(--wp--preset--color--contrast);
}

button.wpcf7cp-cfm-edit-btn:hover,
.form-submit-box input.previous-btn:hover {
  color: var(--wp--preset--color--base);
  background-color: var(--wp--preset--color--contrast-3);
  border-color: var(--wp--preset--color--contrast-3);
}


/* Confirm Plus Contact Form 7 プラグイン */
div#wpcf7cpcnf {
  padding-bottom: 2em;
  box-sizing: border-box;
  z-index: 950;
}
div#wpcf7cpcnf:before {
  display: inline-block;
  content: "内容をご確認ください。よろしければ「この内容で送信」ボタンを押して下さい。";
  margin-bottom: 1em;
  position: relative;
  z-index: 1000;
}
div#wpcf7cpcnf:after {
  content: "";
  position: fixed;
  z-index: 900;
  background-color: rgba(0, 0, 0, 0.9);
  width: 100%;
  top: 0;
  left: 0;
  right: 0;
  bottom: 0;
}
#wpcf7cpcnf > * {
  position: relative;
  z-index: 1000;
}

#wpcf7cpcnf td,
#wpcf7cpcnf th {
  display: inline;
  padding: 0;
  text-align: left;
}
#wpcf7cpcnf th p {
  margin-top: 1em;
  font-size: 90%;
}
#wpcf7cpcnf th p:before {
  content: '';
  display: inline-block;
  width: 0;
  height: 0;
  border: 0.4em solid transparent;
  border-left: 0.7em solid #fff;
}

.wpcf7cp-btns {
  display: flex;
  justify-content: space-around;
  align-items: center;
}
button.wpcf7cp-cfm-submit-btn {
  width: 60%;
}
button.wpcf7cp-cfm-edit-btn {
  width: 30%;
}



/* パスワード保護中ページ
--------------------------------*/
.custom-password-message {
  margin-bottom: 0.5em;
  text-align: center;
  color: #f9c;
}

/* post-password-form */
.post-password-form p:has(input[type=submit]) {
  text-align: center;
}

.post-password-form input[type=submit] {
  width: 96%;
  max-width: 700px;
  padding: 0.8rem 0;
  margin: 2em auto;
  font-size: var(--wp--preset--font-size--medium);
  font-weight: 500;
  font-style: normal;
  color: var(--wp--preset--color--contrast);
  background-color: transparent;
  border: 2px solid var(--wp--preset--color--contrast);
  border-radius: 1em;
  text-decoration: none;
}

.post-password-form input[type=submit]:hover {
  color: var(--wp--preset--color--base);
  background-color: var(--wp--preset--color--contrast-3);
  border-color: var(--wp--preset--color--contrast-3);
}