@charset "UTF-8";

/*
Theme Name: nakayaworld
Theme URI: https://nakayaworld.jp/
Description: nakayaworld WordPress Theme
Author: nakayaworld
Version: 2025_06
Tested up to: 6.4
Requires PHP: 8.3.0
*/

/* basic style setting in utility.css */

/* 変数 */
:root {
  --main_color: #000000;
}



/*---------------------------------------------------------------------
 共通レイアウト
---------------------------------------------------------------------*/
/* レイアウト */
body {position: relative;}
body:before { content: ''; display: block; position: fixed; top: 0; left: 0; width: 100%; height: 100vh; background: url(img/common/body_bg.png) center top no-repeat;  z-index: 0; background-size: cover; z-index:-1}

#main {
width: 100%;
} /* #main */

.inner {width: min(1000px, 100%); margin: auto; padding: 0 20px}

/* ヘッダーまわり */
header {
  margin-bottom: 90px;
  .inner {width: min(100%); padding-top: 55px; padding-left: 45px}
  .site_title {line-height: 1;}
} /* header */

/* Google font */
.lexend {font-family: "Lexend Peta";}


/* 一覧のスタイル：ブロック */
.post_line {
  margin-bottom: 80px;
  .inner {width: min(900px, 100%); position: relative}
  .deco {max-width: 86px; position: absolute; top: -100px; right: 70px; z-index: 10}
  .post_line_wrap {gap: 40px}
  article {margin-bottom: 30px;}
  article a {background: white; border-radius: 30px; padding: 15px 35px 15px 15px; display: block; transition: transform 0.5s, filter 0.5s;}
  article a:hover {background: rgba(255, 255, 255, 0.8)}
  article a:hover dt img {transform: scale(1.03); }
  article dl {gap: 15px 30px; align-items: flex-end;}
  article dt {text-align: center;}
  article dt img {border-radius: 22px;}
  article dd h3 {font-size: clamp(2.2rem, 2.016rem + 0.78vw, 2.8rem); font-weight: 600; line-height: 1.4; margin-bottom: 20px; letter-spacing: .12em; overflow: hidden; display: -webkit-box; -webkit-box-orient: vertical; -webkit-line-clamp: 2; } /* 2行目以降は「…」で省略 親の定義 */
  article dd .type {font-size: clamp(1.4rem, 1.339rem + 0.26vw, 1.6rem); border-bottom: 1px dashed silver; margin-bottom: 18px; padding-bottom: 18px; font-weight: 400}
  article dd .term {font-size: clamp(1.4rem, 1.339rem + 0.26vw, 1.6rem); font-weight: 400; margin-bottom: 10px}
} /* .post_line */

/* Gmap、YouTubeなどコンテンツのレスポンシブ */
iframe.respo {aspect-ratio: 16 / 9; width: 100%; height: 100%; margin-bottom: 50px}

/* Loading */
#loading {position: fixed; width: 100%; height: 100%; z-index: 999; background: white;}
#loading_logo {position: absolute; top: 50%; left: 50%; transform: translate(-50%, -50%);}
.fadeUp {animation-name: fadeUpAnime; animation-duration:0.5s; animation-fill-mode:forwards; opacity: 0;}
@keyframes fadeUpAnime{
  from {opacity: 0;transform: translateY(10px);}
  to {opacity: 1; transform: translateY(0);}
}


/*---------------------------------------------------------------------
 トップページ
---------------------------------------------------------------------*/
.home {
  header {display: none}

  #hero {
    margin-bottom: 120px; min-height: 100svh; display: grid; place-items: center;
    .inner {width: min(1280px, 100%); display: grid; grid-template-columns: 30% 1fr; gap: 0 30px; align-items: center;}
  } /* #hero */

  #lead {
    margin-bottom: 140px;
    h2 {font-family: "Lexend Peta"; font-weight: 300; text-align: center; font-size: clamp(2rem, 1.449rem + 2.35vw, 3.8rem)}
  } /* #lead */

  #link {
    margin-bottom: 120px;
    .inner {width: min(900px, 100%); }
    .wrap {display: flex; justify-content: space-around; gap: 30px 100px; }
    a {transition: all 0.3s ease;}
    dt {margin-bottom: 40px; text-align: center}
    dd {font-family: "Lexend Peta"; text-align: center; font-size: clamp(1.6rem, 1.416rem + 0.78vw, 2.2rem); text-transform: uppercase; transition: all 0.3s ease;}
    a.about:hover dd {color: #4956EA}
    a.project:hover dd {color: #E54545}
    a.contact:hover dd {color: #41B59B}
  } /* #link */

  #statement {
    margin-bottom: 140px;
    p {font-size: clamp(1.5rem, 1.408rem + 0.39vw, 1.8rem); margin-bottom: 50px; text-align: center; line-height: 2.3; letter-spacing: .14em}
  } /* #statement */

  #sns {
    margin-bottom: 70px;
    li {text-align: center; margin-bottom: 50px}
  } /* #sns */
} /* home */




/*---------------------------------------------------------------------
 固定ページ共通
---------------------------------------------------------------------*/
#title_head {
  h2 {text-align: center; line-height: 1; margin-bottom: 60px; font-family: "Lexend Peta"; font-size: clamp(2.5rem, 2.163rem + 1.44vw, 3.6rem); text-transform: uppercase}
  h2 a {pointer-events:none;}
} /* #title_head */



/*---------------------------------------------------------------------
 個別ページ
---------------------------------------------------------------------*/
/* About */
.page-id-2 {
  #title_head {margin-bottom: 160px}

  #lead {
    margin-bottom: 110px;
    h2 {font-family: "Lexend Peta"; font-weight: 300; text-align: center; font-size: clamp(2rem, 1.449rem + 2.35vw, 3.8rem)}
  }

  #statement {
    margin-bottom: 140px;
    p {font-size: clamp(1.5rem, 1.408rem + 0.39vw, 1.8rem); margin-bottom: 50px; text-align: center; line-height: 2.3; letter-spacing: .14em}
  }

  #business {
    margin-block: 200px;
    .inner {width: min(960px, 100%); }
    .voice ul {display: grid; grid-template-columns: 1fr 1fr 1fr; gap: 10px; align-items: center; max-width: 600px; margin: auto; margin-bottom: 20px}
    .voice p {}
    h2 {text-align: center}
    .figure {max-width: 143px; margin: -40px auto 0}
    .detail {border: 4px solid var(--main_color); padding: 30px 80px 40px; border-radius: 30px; margin-top: -10px; margin-bottom: 50px; background: white}
    .detail h3 {font-size: clamp(1.8rem, 1.678rem + 0.52vw, 2.2rem); line-height: 2; text-align: center; font-weight: 600; letter-spacing: .14em; margin-bottom: 20px}
    .detail ul {gap: 30px 20px}
    .detail li {line-height: 1;display: flex; align-items: center; gap: 10px; line-height: 1.6}
    .detail li:nth-of-type(1)::before {content: url(img/page/about_business_mark_01.svg)}
    .detail li:nth-of-type(2)::before {content: url(img/page/about_business_mark_02.svg)}
    .detail li:nth-of-type(3)::before {content: url(img/page/about_business_mark_03.svg)}
    .detail li:nth-of-type(4)::before {content: url(img/page/about_business_mark_04.svg)}
    .detail li:nth-of-type(5)::before {content: url(img/page/about_business_mark_05.svg)}
    .detail li:nth-of-type(6)::before {content: url(img/page/about_business_mark_06.svg)}
    .detail li:nth-of-type(7)::before {content: url(img/page/about_business_mark_07.svg)}
    .detail li:nth-of-type(8)::before {content: url(img/page/about_business_mark_08.svg)}
    .detail li:nth-of-type(9)::before {content: url(img/page/about_business_mark_09.svg)}
    .announce {text-align: center; line-height: 2; margin-bottom: 40px; letter-spacing: .2em; font-size: 1.6rem}
    .to_contact {text-align: center; margin-bottom: 0}
    a.round_btn::before {background: url('img/page/about_business_contact_bg.png') no-repeat center / cover;}
  }

  #intro {
    margin-bottom: 160px;
    dl {gap: 60px 80px}
    dt {position: relative}
    dt .profile {-webkit-clip-path: circle(50% at 50% 50%); clip-path: circle(50% at 50% 50%);}
    dt .deco {max-width: 157px; position: absolute; bottom: -40px; left: -10px;}
    dd hgroup {margin-bottom: 30px}
    dd hgroup h2 {font-size: 2.2rem; letter-spacing: .14em}
    dd hgroup p {font-family: "Lexend Peta"; letter-spacing: .3em; font-size: 1.5rem; font-weight: 500; font-size: 1.5rem}
    dd hgroup p span {text-transform: uppercase;}
    dd .detail {line-height: 2.4; margin-bottom: 50px; font-size: 1.6rem}
    dd .sns {display: flex; flex-wrap: wrap; gap: 20px 50px; align-items: center}
  }
} /* About */



/* Project */
.page-id-15 {
  #title_head {margin-bottom: 120px}
  #title_head p {font-size: clamp(1.6rem, 1.416rem + 0.78vw, 2.2rem); line-height: 2; text-align: center; letter-spacing: .14em}
  .post_line {margin-bottom: 100px}
} /* Project */



/* contact */
.page-id-17 {
  #title_head {margin-bottom: 30px}
  #title_head .motto {font-size: clamp(1.6rem, 1.539rem + 0.26vw, 1.8rem); line-height: 2; text-align: center;  letter-spacing: .14em; margin-bottom: 60px}
  #title_head .figure {max-width: 93px; margin: auto}
  #form_wrap {
    margin-bottom: 80px;
    .inner {width: min(840px, 100%); }
  }



} /* contact */


/*---------------------------------------------------------------------
 フォーム snow monkey form
---------------------------------------------------------------------*/
.snow-monkey-form {
  .smf-form {margin-bottom: 40px}
  .smf-item {margin-bottom: 15px; padding-bottom: 15px}
  .smf-item__label { margin-bottom: 10px}
  .smf-item__label__text {position: relative; font-weight: 400}
  .smf-item__label__text::after {position: absolute; content: '必須'; background: white; top: 60%; transform: translateY(-50%); right: -45px; border-radius: 2px; font-size: 1rem; font-weight: bold; padding: 1px 6px; border: 1px solid silver; border-radius: 5px;}
  .smf-form .smf-text-control__control {width: 100%; border-radius: 10px; font-weight: 400}
  .smf-form .smf-textarea-control__control {border-radius: 10px; font-weight: 400}

  /* 送信ボタン */
  .smf-action {text-align: center}
  .smf-action .smf-button-control button {
    position: relative;
    background: var(--main_color);
    padding: 16px;
    width: 280px;
    border-radius: 50px;
    display: block;
    margin: auto;
    transition: all 0.3s ease;
    line-height: 1;
    color: white;
    overflow: hidden;
    z-index: 0;
  }
  
  .smf-action .smf-button-control button::before {
    content: "";
    position: absolute;
    inset: 0;
    background: url('img/common/round_btn_base.png') no-repeat center / cover;
    opacity: 0;
    transition: opacity 0.4s ease;
    z-index: -1; /* ← ここを変更！テキストより下にする */
    border-radius: 50px;
  }
  
  .smf-action .smf-button-control button:hover::before {opacity: 1;}
} /* .snow-monkey-form  */

/* 確認画面 */
[data-screen="confirm"] .smf-form .smf-item {border-bottom: 1px solid silver; padding-bottom: 20px; margin-bottom: 20px}
[data-screen="confirm"] .smf-form .smf-placeholder {font-weight: 400}
[data-screen="confirm"] .smf-action {display: flex; justify-content: center; flex-wrap: wrap;}
[data-screen="confirm"] .smf-action span:nth-of-type(1) button {width: 100px; }
[data-screen="confirm"] .smf-action span:nth-of-type(2) button {width: 180px; }

/* 送信後画面 */
[data-screen="complete"] p {padding: 0; text-align: center}



/*---------------------------------------------------------------------
 アーカイブ カテゴリ ニュース共通
---------------------------------------------------------------------*/
.archive {}
.category {}
.page-template-article_list_all {}

/* 一覧のページナビ */
.wp-pagenavi {
  text-align: center; margin-bottom: 80px;
  a {background:#f2f2f2 ; color: #7f7f7f; }
  span.current {font-weight: bold; color :#ffffff; background: var(--main_color); border: none;}
  span.pages {display: none !important}
} /* .wp-pagenavi */

#main .wp-pagenavi a, #main .wp-pagenavi span {
  border: none;
  font-size: clamp(1.5rem, 1.425rem + 0.38vw, 1.8rem);
  padding: .8em 1.3em;
  margin: 5px;
  border-radius: 70px; /* 正方形にする場合はここを削除 */
  transition: all .3s ease;
  display: inline-block
} /* #main .wp-pagenavi a */

#main .wp-pagenavi a:hover {background: var(--main_color); color: white;}



/*---------------------------------------------------------------------
 投稿ページ共通
---------------------------------------------------------------------*/
.single-post {
  #title_head {margin-bottom: 90px}

  #content {
  .inner {width: min(1000px, 100%); background: white; border-radius: 30px; padding: 70px; position: relative; margin-bottom: 50px}
  .deco {max-width: 86px; position: absolute; top: -95px; right: 70px;}
  }

  .entry_title {font-size: clamp(2.2rem, 2.016rem + 0.78vw, 2.8rem); font-weight: 600; line-height: 1.4; margin-bottom: 20px; letter-spacing: .12em}
  .entry_meta {
    margin-bottom: 30px;
    .type, .term {font-size: clamp(1.4rem, 1.339rem + 0.26vw, 1.6rem); font-weight: 400; margin-bottom: 6px}
  } /* .entry_meta */
  
  .entry_content {
    padding-bottom: 80px; word-wrap: break-word; font-weight: 400;
    h2 {font-size: clamp(2.2rem, 2.016rem + 0.78vw, 2.8rem); line-height: 1.8; font-weight: 600; word-break: auto-phrase; letter-spacing: .14em; max-width: 680px; margin: auto auto 40px}
    h3 {font-size: 1.6rem; font-weight: 600; letter-spacing: .14em; max-width: 680px; margin: auto auto 20px}
    a img {pointer-events: none;} /* 画像にリンクがついてもリンク解除 */
    a img:hover {opacity: .8}
    figure {margin-bottom: 30px; border-radius: 22px;} /* 画像 */
    figure img {border-radius: 22px;}
    figure a { display: block}
    figcaption {margin-top: 6px; text-align: right; font-size: 1.4rem;} /* キャプション */
    p {line-height: 1.8; max-width: 680px; margin: auto auto 30px;}
    a {color: var(--main_color); text-decoration: underline}
    ul {margin-bottom: 30px}
    .wp-block-file a {text-decoration: underline}
    .wp-block-file a:last-child {display: none}
    a[href$=".pdf"] {display: inline-block; padding: 2px 0 2px 26px; background: url(img/post/icon_pdf_18.svg) no-repeat left center;}
    a[href$=".doc"] {display: inline-block; padding: 2px 0 2px 26px; background: url(img/post/icon_docx_18.svg) no-repeat left center;}
    a[href$=".docx"] {display: inline-block; padding: 2px 0 2px 26px; background: url(img/post/icon_docx_18.svg) no-repeat left center;}
    a[href$=".xls"] {display: inline-block; padding: 2px 0 2px 26px; background: url(img/post/icon_xlsx_18.svg) no-repeat left center;}
    a[href$=".xlsx"] {display: inline-block; padding: 2px 0 2px 26px; background: url(img/post/icon_xlsx_18.svg) no-repeat left center;}
    a[href$=".csv"] {display: inline-block; padding: 2px 0 2px 26px; background: url(img/post/icon_csv_18.svg) no-repeat left center;}
    .wp-block-quote {background: #EBEBEB url(img/post/quote_bk.svg) no-repeat 30px 30px; padding: 80px 30px 30px 30px; border-radius: 30px; margin-bottom: 30px} /* 引用ブロック */
    .wp-block-quote cite {font-size: 1.2rem;} /* 引用 */
    .wp-block-quote cite a { text-decoration: underline} /* 引用 */
    .wp-block-quote cite::before {content: "引用元"; padding-right: 10px} /* 引用 */
    .wp-block-cover p {color: white} /* カバー */
    .wp-block-table table { margin-bottom: 10px} /* カバー */
    .wp-block-columns {gap:30px}
    .wp-block-columns p {margin-bottom: 15px}
    .wp-block-columns ul {margin-bottom: 15px}
    .wp-block-columns figure { margin-bottom: 0}
    .wp-block-gallery ul {margin-bottom: 0}
    .wp-block-button a {color: white; font-weight: bold} /* ボタン */
    .wp-block-button:hover {opacity: .8} /* ボタン */
    .wp-block-gallery {display: flex; flex-wrap: wrap;} /* ギャラリー縦並びになってしまう事の対処 */
    .wp-element-caption a {color: var(--main_color); border-bottom: 1px solid var(--main_color); display: inline-block} /* キャプションにリンクがある場合 */
    .youtube_movie {aspect-ratio: 16 / 9; width: 100%; height: 100%; margin-bottom: 20px} /* YouTube 埋め込み対応（utility.js にてjquery でクラス追加） */
    .google_map {aspect-ratio: 16 / 9; width: 100%; height: 100%; margin-bottom: 20px} /* Google Map 埋め込み対応（utility.js にてjquery でクラス追加） */
    .has-small-font-size { font-size: 1.2rem !important} /* フォントサイズ */
    .has-medium-font-size { font-size: clamp(1.4rem, 1.339rem + 0.26vw, 1.6rem)!important}
    .has-large-font-size { font-size: clamp(1.7rem, 1.669rem + 0.13vw, 1.8rem)!important}
    .has-x-large-font-size { font-size: clamp(1.8rem, 1.739rem + 0.26vw, 2rem)!important}
  } /* .entry_content */

 .client {
  background: #FFEB98; border-radius: 70px; padding: 30px 60px; margin-bottom: 60px;
  dl {display: grid; grid-template-columns: 1fr 25%; gap: 20px; align-items: center;}
  dt {order: 2; text-align: center}
  dt img {-webkit-clip-path: circle(50% at 50% 50%); clip-path: circle(50% at 50% 50%); margin-bottom: 6px; max-width:120px }
  dt p {text-align: center; font-weight: 400; line-height: 1.4; margin-bottom: 0}
  dd {order: 1; font-weight: 400; line-height: 2;}
 }

 .credit {
 margin-bottom: 100px;
 dt {font-family: "Lexend Peta"; text-transform: uppercase; letter-spacing: .2em; font-weight: 600; margin-bottom: 8px; position: relative;}
 dt span {display: inline-block; padding-right: 20px; background: white }
 dt:after {border-top: 1px solid gray ; content: ""; position: absolute; top: 12px; width: calc(100% - 125px);}
 dd {font-weight: 400; line-height: 2}
}

} /* single-post */


/* ページナビゲーション */
.single #single_page_nav {
  margin-bottom: 80px;
  .back {text-align: center; display: flex; justify-content: center; flex-wrap: wrap; align-items: center}
  .back span {background: url('img/post/back_deco.png') no-repeat left top; background-size: 75px; width: 78px; display: inline-block; height: 106px}
  a.round_btn {margin: inherit; max-width: inherit; width: 340px}
  a.round_btn::before {background: url('img/post/back_btn_bg.png') no-repeat center / cover;}
} /* .single #single_page_nav */



/*---------------------------------------------------------------------
 Not 404
---------------------------------------------------------------------*/
.error404 {
  #title_head, #breadcrumb {display: none}
  #main {min-height: 60vh; display: grid; place-items: center; margin-bottom: 40px;}
  #main dt {font-size: clamp(2.7rem, 2.25rem + 2.25vw, 4.5rem); text-align: center; font-family: "Lexend Peta"; text-transform: uppercase}
  #main dd {font-size: clamp(1.2rem, 1rem + 1vw, 2rem); text-align: center; margin-bottom: 20px}
} /* error404 */


/*---------------------------------------------------------------------
 footer
---------------------------------------------------------------------*/
footer {
  width: 100%; background: #fff url(img/common/footer_bg.jpg) repeat-x center top; padding-bottom: 20px;
  .copy {text-align: center; margin-bottom: 0; padding-top: 75px;}
  .copy small {font-size: clamp(1rem, 0.95rem + 0.25vw, 1.2rem); font-weight: 400}
} /* footer */

/* ページトップへ */
p.pagetop {
  position: fixed; bottom: 15px; right: 15px; opacity: 0; transform: scale(1.5); transition: all .5s; text-align: right; width: auto; z-index: 10;
  a {display: block; width: 45px; height: 45px}
  a:hover { transform: scale(1.2)}
  &.show {opacity: 1; transform: scale(1);}
} /* p.pagetop */


/*---------------------------------------------------------------------
 css hack
---------------------------------------------------------------------*/
/* Edge */
@supports (-ms-ime-align: auto) {
  .sample {}
}

/* Firefox */
@-moz-document url-prefix() {
  .sample {}
}

/* Safari */
::-webkit-full-page-media, :future, :root .class_name {
  .sample {}
}


/*---------------------------------------------------------------------
 print
---------------------------------------------------------------------*/
@media print {
  body {-webkit-print-color-adjust: exact;} /* Chrome 背景色強制印刷 */
  a[href]:after {content: "" !important;}
  abbr[title]:after {content: "" !important;}
  .show-for-small-only {display: none !important}
  .pagetop.show {display: none !important}
  body, h1, h2, h3, h4, h5, h6, li, dt, dd, p, th, td, .mincho {font-family: sans-serif !important} /* Chrome印刷で日本語が表示されない対応 */
}


/*---------------------------------------------------------------------
 jquery js 関連 css
---------------------------------------------------------------------*/
/* ハンバーガーメニュー */
.button_container {position: fixed; top: 50px; right: 50px; cursor: pointer; z-index: 200;}
.button_container:hover {opacity: .8;}
.button_container dt {text-align: center}
.button_container dt img {width: 48px}
.button_container dd {text-align: center; font-family: "Lexend Peta"; font-size: 1.6rem; text-transform: uppercase; letter-spacing: .14em}
.button_container dd.close {letter-spacing: 0;}

/* メニュー内 */
.overlay {
  position: fixed; background :white ; top: 30px; right: 25px; width: 125px; height: 0%; opacity: 0; visibility: hidden; transition: opacity .35s, visibility .35s, height .35s; overflow: auto; z-index: 99; border-radius: 17px;
  .overlay-menu { padding-top: 126px}
  dl {margin-bottom: 20px}
  dt {text-align: center; margin-bottom: 4px}
  dt img {width: 50px}
  dd {text-align: center; font-family: "Lexend Peta"; font-size: 1.6rem; text-transform: uppercase; letter-spacing: 0; transition: all 0.3s ease;  font-weight: 500}
  .project img {width: 45px}
  .about:hover dd {color: #4956EA}
  .project:hover dd {color: #E54545}
  .contact:hover dd {color: #41B59B}
} /* .overlay */

.overlay.open {
  opacity: 1; visibility: visible; height: auto; padding-bottom: 10px
} /* .overlay.open */


/*---------------------------------------------------------------------
 メディアクエリー
---------------------------------------------------------------------*/
/* スマホ「縦・横」対応 */
@media screen and (min-width: 320px) and (max-width: 639px) {
  .no_br_sp br {display: none !important}
  br.sp_non {display: none}
  table tr th, table tr td {padding: 0.4em 0.8em; font-size: 1.2rem}
  .single .wp-caption {max-width: 100%}
  .single #single_page_nav ul {justify-content: center}

  #loading_logo {width: 160px}
  header {margin-bottom: 60px;}
  header .inner {padding-top: 30px; padding-left: 30px}
  header .site_title img {width: 130px}

  .button_container dd {letter-spacing: .12em}

  .home #hero {position: relative; }
  .home #hero .inner {padding: 0}
  .home #hero h1 {position: absolute; bottom: 20px; left: 20px; z-index: 10}
  .home #hero h1 img {width: 160px}
  .home #hero .figure {position: absolute; top: 30px;}
  .home #hero .figure picture {width: 90%; margin: auto}

  .home #lead {margin-bottom: 70px}
  .home #link .wrap {gap:20px; flex-wrap: wrap} 
  .home #link .wrap a {width: 40%}

  .home #statement { margin-bottom: 70px}
  .home #statement p {margin-bottom: 30px}

  .page-id-2 #title_head {margin-bottom: 60px}
  .page-id-2 #lead {margin-bottom: 80px}
  .page-id-2 #lead h2 {font-weight: 500}
  .page-id-2 #statement p {margin-bottom: 30px}
  .page-id-2 #business h2 {width: 90%; margin: auto;}
  .page-id-2 #business .figure {width: 110px; margin-top: -30px}
  .page-id-2 #business .detail {padding: 30px 30px 40px; width: 90%; margin: -10px auto 50px}
  .page-id-2 #business .detail li {gap: 18px}
  .page-id-2 #business a.round_btn {max-width: 200px}
  .page-id-2 #intro {margin-bottom: 80px}
  .page-id-2 #intro dt {text-align: center}
  .page-id-2 #intro dt .profile {max-width: 70%}
  .page-id-2 #intro dt .deco {max-width: 90px; left: 30px;}
  .page-id-2 #intro hgroup h2 {text-align: center; margin-bottom: 8px}
  .page-id-2 #intro hgroup p {text-align: center}
  .page-id-2 #intro dd .sns {gap:40px}
  .page-id-2 #intro dd .sns li {width: 100%; text-align: center; }
  
  .post_line .deco {max-width: 60px; right: 100px; top: -70px}
  .post_line article {margin-bottom: 40px}
  .post_line article a {padding: 20px}

  .single-post #content {padding: 20px}
  .single-post #content .deco {max-width: 60px; top: -70px}
  .single-post #content .inner {padding: 30px 25px} 
  .single-post .client {padding: 40px 40px 30px}
  .single-post .client dl {grid-template-columns: 1fr;} 
  .single-post .client dd {padding: 0}
  .single #single_page_nav a.round_btn {width: 180px}

  .button_container {top: 30px; right: 30px;}
  .overlay {top: 10px; right: 10px; width: 110px}
  .overlay dd {letter-spacing: 0}
  .overlay .overlay {padding-top: 110px;}
}


/* スマホ〜タブレット共通 */
@media screen and (min-width: 320px) and (max-width: 1023px){
  .no_br br {display: none !important}
}


/* スマホ「縦」向き対応 */
@media screen and (min-width: 320px) and (orientation:portrait) {
  .sample {}
}


/* スマホ以降（375px 以下）iPhone SE */
@media screen and (max-width: 375px) {
  .inner {padding: 0 10px}
}


/* スマホ以降（320px 以下）旧 iPhone SE */
@media screen and (max-width: 320px) {
  .sample {}
}


/* スマホ以降（321px 以降） */
@media screen and (min-width: 321px) {
  .sample {}
}


/* タブレット対応 */
@media screen and (min-width: 640px) and (max-width: 1023px) {
  .no_br_tb br {display: none !important}
  br.tb_non {display: none}

  .home #link .wrap {gap: 50px}
  .page-id-2 #intro dl {gap: 30px;} 
  .page-id-2 #intro dt .deco {max-width: 120px; bottom: 180px; left: 20px}
  .single-post #content {max-width: 95%; margin: auto}
  .page-id-17 #form_wrap .inner {width: min(680px, 100%); }
}


/* タブレット以降（640px 以降） */
@media screen and (min-width: 640px) {
  .logged-in header {padding-top: 32px; margin-top: -32px} /* ログイン時のアドミンバー対応（ヘッダー） */
  .post_line article dd h3 {min-height: 3em}
  .entry_content .wp-block-table td, .wp-block-table th {padding: 1em;}
}


/* 1024px以降 iPad 横 iPad 12.9 縦 含む */
@media screen and (min-width: 1024px) {
  .mw_wp_form .no_requir dt {padding-left: 42px}
}


/* PCモニター（1025px以降） */
@media screen and (min-width: 1025px) {
  .no_br_pc br { display: none}
  br.pc_non {display: none} 
}


/* PCモニター（1240px以降） */
@media screen and (min-width: 1240px) {
  .sample {}
}


/* PCモニター大（1480px以降） */
@media screen and (min-width: 1480px) {
  .sample {}
}