/*
Theme Name: SWELL CHILD
Template: swell
Version: 2.0.0
Description: takahashikohei.com 用 SWELL 子テーマ(NakauchiMade)。旧テーマ HEAL(TCD) の CSS を移植して見た目を 1:1 に寄せる。
*/

/* =========================================================
   0. ベース(HEAL: 明朝 / 生成り #f4f0ec / 黒 #020000 / グレー #999999)
   ========================================================= */
:root{ --tk-black:#020000; --tk-gray:#999999; --tk-bg:#f4f0ec; --tk-serif:"Times New Roman","游明朝","Yu Mincho","游明朝体","YuMincho","ヒラギノ明朝 Pro W3","Hiragino Mincho Pro","HiraMinProN-W3","HGS明朝E","ＭＳ Ｐ明朝","MS PMincho",serif; --tk-gothic:"Hiragino Sans","ヒラギノ角ゴ ProN","Hiragino Kaku Gothic ProN","游ゴシック",YuGothic,"メイリオ",Meiryo,sans-serif; }
body{ font-family:var(--tk-serif); background:var(--tk-bg); color:var(--tk-black); font-size:14px; line-height:1.8; }
a{ color:var(--tk-black); text-decoration:none; } a:hover{ color:var(--tk-gray); }
.rich_font{ font-family:var(--tk-serif); font-weight:500; }
.gothic_font, .button_font{ font-family:var(--tk-gothic) !important; font-weight:500; }
.clearfix::after{ content:""; display:block; clear:both; }

/* コンテンツ幅 = HEAL 1000px */
.l-content.l-container{ max-width:1000px; }
@media (min-width:1040px){ .l-content.l-container{ padding-left:0; padding-right:0; } }
.home .l-content{ padding-top:0; margin-top:0; }
.home .l-mainContent__inner, .home .post_content{ margin-top:0; padding-top:0; }
.home .post_content > .alignfull{ margin-top:0; }

/* =========================================================
   1. ヘッダー(HEAL: 透過・absolute・ロゴ32px左・メニュー左寄せ・SNS右)
   ========================================================= */
.l-header{ background:transparent !important; box-shadow:none !important; border:0; }
.l-header__bar{ display:none; }
.home .l-header{ position:absolute; top:0; left:0; width:100%; z-index:20; }
.l-header__inner{ max-width:none; height:auto; padding:40px 40px 0; align-items:flex-start; justify-content:flex-start; }
.l-header__logo{ margin-right:60px; padding-top:9px; }
.c-headLogo{ margin:0; }
.c-headLogo__link{ font-family:var(--tk-serif); font-weight:500; font-size:32px !important; line-height:1; letter-spacing:.02em; color:var(--tk-black); }
.l-header__gnav{ margin:0; }
.c-gnav{ font-family:var(--tk-gothic); font-weight:500; }
.c-gnav > li > a{ font-size:14px; padding:0 25px; line-height:1.4em; color:#000; }
.c-gnav > li > a .ttl{ letter-spacing:.02em; }
.c-gnav > li > a::before, .c-gnav > li > a::after{ display:none; }
.c-gnav > li > a:hover{ color:var(--tk-gray); }
#header_social_link{ position:absolute; right:55px; top:44px; margin:0; padding:0; list-style:none; font-size:0; z-index:21; }
#header_social_link li{ display:inline-block; margin:0 10px; }
#header_social_link li a{ display:block; width:20px; height:20px; line-height:20px; text-align:center; font-size:15px; color:var(--tk-black); }
#header_social_link li.youtube a{ width:45px; }
#header_social_link li a:hover{ color:#aaa; }
.w-header .c-widget{ margin:0; }
/* フェードイン(HEAL) */
.c-headLogo, .c-gnav, #header_social_link{ opacity:0; transform:translate(0,50px); }
.c-headLogo.scrollin{ opacity:1; transform:none; transition:all .5s; transition-delay:.5s; }
.c-gnav.scrollin, #header_social_link.scrollin{ opacity:1; transform:none; transition:all .5s; transition-delay:1s; }
.l-header__menuBtn .c-iconBtn__icon, .l-header__customBtn{ color:var(--tk-black); }
.l-header__customBtn{ display:none !important; }
@media (max-width:1200px){
  .l-header__inner{ padding:24px 10px 0; }
  .l-header__logo{ margin-right:0; padding-top:0; }
  .c-headLogo__link{ font-size:18px !important; }
  #header_social_link{ display:none; }
}

/* =========================================================
   2. ヒーロー #_main_image(HEAL の独自HTML/CSSをそのまま移植・画像は子テーマ img/)
   ========================================================= */
.tk-hero{ margin-top:0 !important; margin-bottom:0 !important; }
#_main_image{ width:100%; height:100vh !important; background:#000; position:relative; overflow:hidden; }
#_main_image .back{ width:100%; height:100vh; background:url("img/main_image.jpg") no-repeat center center; background-size:cover; position:absolute; top:0; left:0; z-index:0; }
#_main_image img{ max-width:none; }
#_main_image .moji01{ margin-left:92px; width:auto !important; height:92px !important; position:absolute; bottom:270px; z-index:20; }
#_main_image .moji02{ margin-left:92px; width:auto !important; height:79px !important; position:absolute; bottom:191px; z-index:20; }
#_main_image .moji03{ margin-left:92px; clear:both; width:auto; height:35px; position:absolute; bottom:156px; z-index:20; }
#_main_image .moji01.delay04{ left:0; } #_main_image .moji01.delay05{ left:64px; } #_main_image .moji01.delay06{ left:142px; } #_main_image .moji01.delay07{ left:212px; } #_main_image .moji01.delay08{ left:291px; } #_main_image .moji01.delay09{ left:368px; } #_main_image .moji01.delay10{ left:448px; } #_main_image .moji01.delay11{ left:506px; } #_main_image .moji01.delay12{ left:587px; }
#_main_image .moji02.delay13{ left:0; } #_main_image .moji02.delay14{ left:73px; } #_main_image .moji02.delay15{ left:153px; } #_main_image .moji02.delay16{ left:227px; } #_main_image .moji02.delay17{ left:307px; } #_main_image .moji02.delay18{ left:373px; }
#_main_image .moji03.delay19{ left:0; }
#_main_image .copy{ margin:-92px 0 0 0; width:15px; position:absolute; top:50%; right:92px; z-index:3; }
#_main_image .copy img{ width:100%; height:auto; }
@media (max-width:1200px){
  #_main_image .moji01{ bottom:158px; margin-left:20px; width:auto !important; height:46px !important; }
  #_main_image .moji02{ bottom:112px; margin-left:20px; width:auto !important; height:40px !important; }
  #_main_image .moji03{ bottom:92px; margin-left:20px; width:auto !important; height:18px !important; }
  #_main_image .moji01.delay04{ left:0; } #_main_image .moji01.delay05{ left:32px; } #_main_image .moji01.delay06{ left:71px; } #_main_image .moji01.delay07{ left:106px; } #_main_image .moji01.delay08{ left:145px; } #_main_image .moji01.delay09{ left:184px; } #_main_image .moji01.delay10{ left:224px; } #_main_image .moji01.delay11{ left:253px; } #_main_image .moji01.delay12{ left:293px; }
  #_main_image .moji02.delay13{ left:0; } #_main_image .moji02.delay14{ left:36px; } #_main_image .moji02.delay15{ left:76px; } #_main_image .moji02.delay16{ left:113px; } #_main_image .moji02.delay17{ left:153px; } #_main_image .moji02.delay18{ left:186px; }
  #_main_image .moji03.delay19{ left:0; }
  #_main_image .copy{ margin:-46px 0 0 0; width:8px; top:50%; right:20px; }
  #_main_image .back{ background-position:18% center; }
}
.fadein{ opacity:0 !important; transform:translate(0,50px); }
.fadein.scrollin{ opacity:1 !important; transform:translate(0,0); transition:all .5s; }
.delay01.scrollin{ transition-delay:.5s; } .delay02.scrollin{ transition-delay:1s; } .delay03.scrollin{ transition-delay:1.2s; } .delay04.scrollin{ transition-delay:1.4s; } .delay05.scrollin{ transition-delay:1.6s; } .delay06.scrollin{ transition-delay:1.8s; } .delay07.scrollin{ transition-delay:2s; } .delay08.scrollin{ transition-delay:2.2s; } .delay09.scrollin{ transition-delay:2.4s; } .delay10.scrollin{ transition-delay:2.6s; } .delay11.scrollin{ transition-delay:2.8s; } .delay12.scrollin{ transition-delay:3s; } .delay13.scrollin{ transition-delay:3.2s; } .delay14.scrollin{ transition-delay:3.4s; } .delay15.scrollin{ transition-delay:3.6s; } .delay16.scrollin{ transition-delay:3.8s; } .delay17.scrollin{ transition-delay:4s; } .delay18.scrollin{ transition-delay:4.2s; } .delay19.scrollin{ transition-delay:4.4s; }

/* =========================================================
   3. トップのコンテンツビルダー(HEAL style.css を移植・色は TCD 設定値)
   ========================================================= */
#contents_builder{ padding-bottom:149px; }
.cb_contents{ padding:97px 0 0; width:1000px; max-width:100%; margin:0 auto; }
.post_content .cb_contents h3, .post_content .cb_contents p{ margin:0; }
/* SWELL の見出し装飾(下線・帯・疑似要素)を HEAL の見出しに効かせない */
.post_content .cb_contents h3, .post_content .menu_content h3{ background:none; border:0; padding:0; box-shadow:none; }
.post_content .cb_contents h3::before, .post_content .cb_contents h3::after, .post_content .menu_content h3::before, .post_content .menu_content h3::after{ display:none; content:none; }
/* 全幅にする帯(OPEN 告知) */
.post_content .index_campaign.alignfull{ width:100vw; max-width:100vw; margin-left:calc(50% - 50vw); margin-right:calc(50% - 50vw); }
.post_content .button{ text-align:center; }
.post_content .button a{ font-size:16px; display:inline-block; min-width:250px; height:60px; line-height:60px; border:1px solid var(--tk-black); color:var(--tk-black); padding:0 20px; text-decoration:none; transition:all .2s ease; }
.post_content .button a:hover{ color:#fff; background:var(--tk-black); border-color:var(--tk-black); }
/* デザインコンテンツ1 */
.index_design_content1 .catch{ text-align:center; line-height:1.6; margin:0 0 12px; font-size:38px; font-weight:500; color:var(--tk-black); }
.index_design_content1 .desc{ text-align:center; line-height:2.6; margin:0 0 44px !important; font-size:16px; }
/* デザインコンテンツ2 = MENU バナー */
.index_design_content2{ padding-top:60px; }
.index_design_content2 .banner_content{ height:300px; }
.index_design_content2 .banner_content a{ display:block; width:100%; height:100%; position:relative; color:#fff; }
.index_design_content2 .banner_content .content{ position:absolute; z-index:10; text-align:center; width:100%; margin-top:12px; top:50%; transform:translateY(-50%); }
.index_design_content2 .banner_headline{ text-align:center; line-height:1.6; margin:0 0 26px !important; font-size:38px; font-weight:500; color:#fff; }
.index_design_content2 .banner_headline span{ display:block; font-size:18px; }
.index_design_content2 .banner_content .image_wrap{ display:block; width:100%; height:300px; position:relative; z-index:1; overflow:hidden; }
.index_design_content2 .banner_content .image{ width:100%; height:100% !important; display:block; background-size:cover; background-position:center; transition:transform .6s; }
.index_design_content2 .banner_content a:hover .image{ transform:scale(1.05); }
.index_design_content2 .banner_content .overlay{ display:block; width:100%; height:300px; position:absolute; z-index:2; top:0; left:0; background:#000; opacity:.5; }
/* NEWS */
.index_news{ padding-top:44px; }
.index_news .headline, .index_blog .headline{ text-align:center; line-height:1.6; font-size:38px; font-weight:500; color:var(--tk-black); }
.index_news .headline{ margin:-10px 0 49px !important; }
.index_news .item a{ display:block; border:1px solid #ddd; background:#f7f7f7; margin:0 0 -1px; height:58px; line-height:58px; padding:0 30px; color:var(--tk-black); }
.index_news .item a:hover{ background:#fff; }
.index_news .item a .date{ color:#593306; float:left; font-size:14px; margin:0 30px 0 0 !important; font-weight:600; }
.index_news .item a .title{ font-size:14px; overflow:hidden; white-space:nowrap; text-overflow:ellipsis; font-weight:normal; line-height:58px; }
.index_news .button{ margin-top:59px; }
/* カルーセル枠 → OPEN 告知(全幅の黒ベース帯) */
.index_campaign{ width:100%; position:relative; margin-top:100px !important; background:#000 center/cover no-repeat; overflow:hidden; padding:110px 20px; text-align:center; color:#fff; }
.index_campaign .overlay{ position:absolute; inset:0; background:#000; opacity:.3; z-index:2; }
.index_campaign_inner{ width:1000px; max-width:100%; margin:0 auto; position:relative; z-index:10; }
.index_campaign .open_sub{ font-size:13px; letter-spacing:.3em; color:#fff; }
.index_campaign .headline{ font-size:38px; font-weight:500; color:#fff; line-height:1.6; margin:.3em 0 .4em !important; }
.index_campaign .desc{ font-size:16px; line-height:2; margin:0 0 33px !important; color:#fff; }
.index_campaign .button a{ color:#fff; border-color:rgba(255,255,255,.5); }
.index_campaign .button a:hover{ color:var(--tk-black); background:#fff; border-color:#fff; }
/* BLOG */
.index_blog{ padding-top:44px; }
.index_blog .headline{ margin:-13px 0 50px !important; }
.blog_list{ width:calc(100% + 2px); display:flex; flex-wrap:wrap; }
.blog_list .item{ background:#fff; width:calc(100% / 3); height:376px; border:1px solid #ddd; margin:0 -1px -1px 0; position:relative; box-sizing:border-box; }
.blog_list .image_wrap{ display:block; width:calc(100% + 2px); height:210px; position:relative; z-index:1; overflow:hidden; margin:-1px -1px 0; }
.blog_list .image{ width:100%; height:100% !important; display:block; background:#eee center/cover no-repeat; transition:transform .6s; }
.blog_list .link:hover .image{ transform:scale(1.05); }
.blog_list .title_area{ padding:25px 30px; }
.blog_list .title{ line-height:1.8; max-height:5.4em; overflow:hidden; font-weight:500; font-size:16px; }
.blog_list .title a{ display:-webkit-box; -webkit-box-orient:vertical; -webkit-line-clamp:3; color:var(--tk-black); }
.blog_list .title a:hover{ color:var(--tk-gray); }
.blog_list .post_meta{ position:absolute; bottom:25px; left:30px; margin:0; padding:0; list-style:none; }
.blog_list .post_meta li{ display:inline; line-height:1.8; font-size:12px; margin:0 10px 0 0; padding:0; color:#999; }
.blog_list .post_meta li a{ color:#999; }
.index_blog .button{ margin-top:59px; }
@media (max-width:750px){
  #contents_builder{ padding-bottom:60px; }
  .cb_contents{ padding:40px 20px 0; }
  .post_content .button a{ font-size:14px; min-width:200px; height:50px; line-height:50px; }
  .index_design_content1 .catch{ font-size:22px; line-height:1.4; margin:0 0 7px; }
  .index_design_content1 .desc{ font-size:14px; line-height:2.2; margin:0 0 20px !important; }
  .index_design_content2{ padding-top:35px; }
  .index_design_content2 .banner_content, .index_design_content2 .banner_content .image_wrap, .index_design_content2 .banner_content .overlay{ height:220px; }
  .index_design_content2 .banner_headline{ font-size:22px; margin:0 0 20px !important; }
  .index_design_content2 .banner_headline span{ font-size:12px; }
  .index_news{ padding-top:30px; }
  .index_news .headline, .index_blog .headline{ font-size:22px; }
  .index_news .headline{ margin:0 0 17px !important; }
  .index_news .item a{ background:#fff; height:auto; line-height:1; padding:18px 20px 16px; }
  .index_news .item a .date{ float:none; font-size:12px; margin:0 0 10px !important; display:block; }
  .index_news .item a .title{ font-size:14px; line-height:1.5; white-space:normal; max-height:3em; }
  .index_news .button{ margin-top:30px; }
  .index_campaign{ margin-top:40px !important; padding:60px 20px; }
  .index_campaign .headline{ font-size:22px; }
  .index_campaign .desc{ font-size:13px; }
  .index_blog{ padding-top:30px; }
  .index_blog .headline{ margin:0 0 14px !important; }
  .blog_list .item{ width:50%; height:219px; }
  .blog_list .image_wrap{ height:100px; }
  .blog_list .title_area{ padding:15px 20px; }
  .blog_list .title{ line-height:1.6; max-height:4.8em; font-size:13px; }
  .blog_list .post_meta{ bottom:13px; left:20px; }
  .blog_list .post_meta li{ font-size:10px; margin:0 5px 0 0; }
  .index_blog .button{ margin-top:40px; }
}

/* =========================================================
   4. 下層ページのタイトル帯(HEAL #page_header 430px・中央・サブタイトル)
   ========================================================= */
#top_title_area.l-topTitleArea{ position:relative; height:430px; overflow:hidden; margin:0; }
#top_title_area .l-topTitleArea__img{ position:absolute; inset:0; width:100%; height:100%; object-fit:cover; }
#top_title_area::after{ content:""; position:absolute; inset:0; background:#000; opacity:.3; z-index:1; }
#top_title_area .l-topTitleArea__body{ position:absolute; inset:0; z-index:2; display:flex; flex-direction:column; justify-content:center; align-items:center; text-align:center; color:#fff; max-width:800px; margin:0 auto; padding:0 20px; }
#top_title_area .c-pageTitle{ font-family:var(--tk-serif); font-weight:500; font-size:38px; color:#fff; margin:0; letter-spacing:.02em; line-height:1.4; }
#top_title_area .c-pageExcerpt{ font-family:var(--tk-serif); font-size:20px; margin:13px 0 0; color:#fff; }
.p-breadcrumb{ font-family:var(--tk-gothic); font-size:12px; }
@media (max-width:750px){
  #top_title_area.l-topTitleArea{ height:230px; }
  #top_title_area .c-pageTitle{ font-size:24px; }
  #top_title_area .c-pageExcerpt{ font-size:13px; margin-top:8px; }
}

/* =========================================================
   5. 料金ページ(HEAL .menu_content2 / .menu_price_list.type2)
   ========================================================= */
#menu_single{ padding-top:20px; }
.menu_content{ margin-bottom:100px; }
.menu_content:last-child{ margin-bottom:40px; }
.post_content .menu_content2 .list_headline{ height:60px; line-height:60px; text-align:center; font-size:22px; font-weight:500; margin:-1px 0 0; padding:0; background:var(--tk-black); color:#fff; border:0; }
.post_content .menu_price_list{ width:100%; border-collapse:collapse; margin:0; }
.post_content .menu_price_list td{ border:1px solid #ddd; border-top:none; background:#fff; padding:25px 30px 20px; font-size:14px; box-sizing:border-box; vertical-align:middle; }
.post_content .menu_price_list.type2 .col1{ width:auto; text-align:left; font-size:14px; }
.post_content .menu_price_list.type2 .col2{ width:180px; text-align:center; font-size:16px; white-space:nowrap; }
.post_content .menu_price_list td p{ line-height:2; margin:0; }
.post_content .menu_price_list .time{ display:inline-block; margin-left:1em; font-size:12px; color:var(--tk-gray); font-family:var(--tk-gothic); }
.post_content .menu_content .note{ margin:20px 0 0; font-size:13px; line-height:2; color:#555; }
.post_content .tk-price-lead{ text-align:center; font-size:14px; margin:0 0 50px; }
@media (max-width:750px){
  .menu_content{ margin-bottom:50px; }
  .post_content .menu_price_list td{ padding:15px; }
  .post_content .menu_price_list.type2 .col2{ width:110px; font-size:14px; }
  .post_content .menu_price_list .time{ display:block; margin:4px 0 0; }
}

/* =========================================================
   6. フッター(HEAL #return_top / #footer_banner / #footer_top / #company_date / #copyright)
   ========================================================= */
.l-footer{ margin-top:0; }
.l-footer__foot{ display:none; }
.w-beforeFooter .l-container{ max-width:none; padding:0; }
.w-beforeFooter .c-widget{ margin:0; }
#return_top a{ background:#fff; border-top:1px solid #ddd; display:block; width:100%; height:58px; line-height:58px; text-align:center; color:#000; font-size:11px; letter-spacing:.1em; font-family:var(--tk-gothic); }
#return_top a:hover{ background:#f4f4f4; }
#footer_banner{ width:100%; height:300px; display:flex; }
#footer_banner .item{ width:calc(100% / 3); height:300px; position:relative; box-sizing:border-box; }
#footer_banner a{ display:block; width:100%; height:100%; position:relative; }
#footer_banner .image_wrap{ display:block; width:100%; height:300px; position:relative; z-index:1; overflow:hidden; }
#footer_banner .image{ width:100%; height:100% !important; display:block; background:#ccc center/cover no-repeat; transition:transform .6s; }
#footer_banner a:hover .image{ transform:scale(1.05); }
#footer_banner .title{ width:100%; height:60px; line-height:60px; text-align:center; position:absolute; top:240px; left:0; z-index:3; font-size:22px; color:#fff; background:rgba(2,0,0,.6); margin:0; font-weight:500; }
#footer_top{ background:var(--tk-bg); padding:60px 0; text-align:center; }
#footer_logo{ margin:0 0 35px; }
#footer_logo .logo{ line-height:1; padding:0; font-weight:500; font-size:32px; margin:0; font-family:var(--tk-serif); }
#footer_logo .logo a{ color:var(--tk-black); }
#footer_social_link{ margin:0; padding:0 0 8px; list-style:none; font-size:0; }
#footer_social_link li{ display:inline-block; margin:0 10px; }
#footer_social_link li a{ display:block; width:20px; height:20px; line-height:20px; text-align:center; font-size:15px; color:var(--tk-black); }
#footer_social_link li.youtube a{ width:45px; }
#footer_social_link li a:hover{ color:#aaa; }
#footer_button{ text-align:center; margin:29px 0 0; }
#footer_button a{ font-size:16px; display:inline-block; min-width:250px; height:60px; line-height:60px; border:1px solid var(--tk-black); color:var(--tk-black) !important; transition:all .2s ease; }
#footer_button a:hover{ color:#fff !important; background:var(--tk-black); }
#company_date{ text-align:center; height:60px; line-height:60px; font-size:14px; border-top:1px solid #ddd; background:#fff; margin:0; box-sizing:border-box; }
#copyright{ width:100%; line-height:60px; height:60px; font-size:12px; text-align:center; background:var(--tk-black); color:#fff; margin:0; box-sizing:border-box; }
@media (max-width:750px){
  #footer_banner{ height:auto; flex-direction:column; }
  #footer_banner .item, #footer_banner .image_wrap{ width:100%; height:160px; }
  #footer_banner .title{ top:100px; font-size:20px; }
  #footer_top{ padding:40px 20px; }
  #footer_logo .logo{ font-size:24px; }
  #footer_button a{ font-size:14px; min-width:200px; height:50px; line-height:50px; }
  #company_date{ height:auto; line-height:1.8; padding:14px 20px; font-size:12px; }
}

/* =========================================================
   7. ブログ一覧・投稿(SWELL の一覧を HEAL の白カード風に)
   ========================================================= */
.p-postList.-type-card .p-postList__item{ border:1px solid #ddd; background:#fff; }
.p-postList__title{ font-weight:500; }
.c-postTitle__ttl{ font-weight:500; }